Forum Moderators: not2easy
i'm trying to have a typical html background tile image, then another background image on top of that which will sit centered at the bottom of the page. I've used <div> in css to set this up.
the problem is when i have content, such as another table in the body that extends off the page. when this happens, and the scollbars appear, the scrolling actually 'wipes out' the background from the bottom of the page (in firefox/mozilla on mac). i've played around with overflow, but it doesn't seem to solve this issue.
i know i'm probably not explaining this clearly, so here's some examples:
first example is how i *want* it to work, but in this case i'm just using a standard html page background image. when you make the browser window smaller and the scrollbars appear, the background image stays put and doesn't disappear:
<No URLs, thanks. See TOS [WebmasterWorld.com] and CSS Forum Charter [WebmasterWorld.com]>
i'm a bit new to doing all this in css, where before i was using tables. i've seen the light and am avoiding tables where possible. any thoughts on this would be greatly appreciated.
thanks, peter
[edited by: SuzyUK at 7:32 am (utc) on Mar. 4, 2005]
div {
background-attachment: fixed;
background-position: bottom center;
background-repeat: no-repeat;
}
This will work in Gecko browsers, but IE will incorrectly scroll the BG image with the content. The only image that IE will allow to stay put when specifying background-attachment: fixed is the body's bg image. If you can place that image there somehow that will be your work-around.
Hope that helps.
