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
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
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
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
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.
@Paulie_D Thanks mate... that's exactly what i was looking for.