- This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hi All,
I have a layout which requires both the header and footer to stretch to fit browser width the rest of the content being in a standard 960px width container. Any idea of how to do this?
What I have done is apply the header background for the body to cover the body area and create a footer div outside my wrapper divs for content hoping this would stretch to the maximum. however this produces a horizontal scroll bar, how can i do this without any horizontal scroll bar.
The relevent structure I’m using is as follows:
With the following CSS
#footer { background:url(images/footer-bg.png) repeat-x #f8dd2e; height:47px; width:100%; color:#000; font-size:10px;
text-transform:uppercase; letter-spacing:1px; text-align:center;}
#page-wrapper {
width:960px;
margin: 0 auto;
}
Any help would be wonderful.
what browser do you see the scroll-bar, and what is your resolution?
I do not see a scroll-bar when tested in Firefox, and your plan is what the solution should be…
Hi Blue,
Thanks for the response. I get it on both FF and Chrome but not in IE strangely enough. Any ideas?
oops, turns out the fault was with one of my internal divs which had a 100% width, weird. anyways thanks for your help.