CSS positioning

[yrsengar]

Hi,

I am having trouble to position an element.
I have written some code on codepen to show you what exactly i want to achieve.
Here is the link [dummy code](http://codepen.io/yrsengar/full/rkdoi “http://codepen.io/yrsengar/full/rkdoi”)

I have created div called wrapper, which is the outer most div with 100% width and height.

Everything, header content and footer in inside another div called inner-wrap.

I want my footer background to take 100% width of browser.
As everything is the the div called inner-wrap which has width of 960px. I created a div called footer-back outside the wrap div (inside the wrapper) and gave it absolute positioning, width of 100%. As the wrapper also have 100% width of browser so footer-back will also have the same.

But the problem is, if you add more text in the content section then the footer-back will not match the footer background because footer-back is positioned inside the wrapper not the footer.

In short I want footer background to have 100% of browser window. I tried everything i know but couldn’t achieve what i want. Any ideas?
Many Thanks

[Paulie_D]

I guess this is what you are after….http://codepen.io/Paulie-D/pen/vpJCb

Based on what I can read from your comments, you really don’t need the ‘wrapper’ div at all. It’s just the page which is automatically 100% wide.

[yrsengar]

@Paulie_D Thanks mate… that’s exactly what i was looking for.

[Author]

Posts