JLG Posted January 12, 2006 Share Posted January 12, 2006 Hi,I have a problem which seems really stupid.I have a page with a backgound image, on that page i have a container div which contains a header div, menu div and a content div. All my divs are positioned and styled with CSS. The container div has a background colour of white, i want it to stretch to the whole page height. If i put in height:300px i can see the div but if i put height:100% it disappears. It needs to work in IE.Please help. Link to comment Share on other sites More sharing options...
aspnetguy Posted January 12, 2006 Share Posted January 12, 2006 please post your code. Link to comment Share on other sites More sharing options...
JLG Posted January 13, 2006 Author Share Posted January 13, 2006 Sorry for the delay,Html with links and menu code taken out: <body bgcolor="#FFFFFF" text="#000000"><div id="container"><div id="topmenucontainer"><div id="headerimages"><a href="#"><img src="#" border="0" alt="Go to homepage"></a></div><div id="topmenu"></div></div><div id="content"><div id="leftmenucontainer"><img src="#"><br><br><img src="#"></div><div id="textarea"><h3><b>Lorem ipsum dolor</b></h3><h5>sit amet, consectetuer adipiscing</h5>sit amet, consectetuer adipiscing elit. Fusce nec eros. Fusce mattis luctus libero. Duis sagittis. Etiam ultricies, dui sit amet aliquet hendrerit.<br><br>dolor ipsum nonummy libero, sit amet lacinia nulla lacus sit amet massa. Nam non lacus a neque posuere ultrices. In sit amet velit in erat tempus consectetuer. </div></div></div></body> CSS code: body {background-image:url("../images/bg.gif");background-color:#863481;text-align: center;margin:0px;padding:0px;}a {font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 11px;color: #555555;text-decoration:none;outline: none;}#container {border-left:2px solid #863481;border-right:2px solid #863481;width:754px;height:100%;text-align: left;margin: 0px auto;background-color: #FFFFFF;padding:0px;position:relative;z-index:1;}#topmenucontainer {width:750px;height:175px;margin-top:1px;border-top:1px solid #863481;padding-top:1px;padding:0px;position:absolute;top:0px;z-index:100;}#headerimages {height:150px;padding:0px;padding-top:1px;}#content {font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 11px;color:#863481;width:730px;height:500px;padding:0px;margin:10px;position:absolute;top:175px;z-index:1;}#leftmenucontainer {width:175px;padding:0px;margin:0px;float:left;position:absolute;z-index:1;}#textarea {float:right;width:530px;z-index:1;position:relative;} Strange thing is if i take out the doctype (<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">) the div goes to 100% put it back in it disappears again. hope someone can help. Link to comment Share on other sites More sharing options...
JLG Posted January 16, 2006 Author Share Posted January 16, 2006 Incase anyone is interested i solved this problem by changing: html, body {background-image:url("../images/bg.gif");background-color:#863481;text-align: center;margin:0px;padding:0px;height:100%;z-index: 0; position: relative; top: 0; left: 0;} Link to comment Share on other sites More sharing options...
boen_robot Posted January 16, 2006 Share Posted January 16, 2006 Notice that the method you have used is buggy in IE6. It makes unneccesarry scrollbar. In order to neutralize this you should add this: *html {height: auto;} Because of the star, this code is read only by IE6. This takes out the HTMLs strech making the page strech good in IE as well. Link to comment Share on other sites More sharing options...
JLG Posted January 16, 2006 Author Share Posted January 16, 2006 Thank you i've added that in. Link to comment Share on other sites More sharing options...
playmenow Posted January 18, 2006 Share Posted January 18, 2006 & the doctype? It's HTML Strict......there are no attributtes here: <body bgcolor="#FFFFFF" text="#000000"> So, you might change that with CSS. also, change id with class & in css, # with . (dot)IE loads it faster. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now