View Full Version : Height 100%

Nov 27th, 2006, 09:36 PM
I know this has been asked a few thousand times before but I'm still struggling - I had it all working last night and now its not working...

So I have a div that I want to be min-height:100% and thats basically it. Nothing more complex than that but I just cant seem to fiddle it.

The site is here: link removed I can post the html and css if you like but its probably easier for you to just go see it in action. Its a fairly simple site, mostly semantic code (I think I have 1 label used for formatting but other than that)
As I said - last night it was working but I had to fiddle things around a bit tonight to get the transparency working (for FF & IE7) and added the height:100% for ie6 thing in. I've probably spent more time on this than the rest of the site - which is silly for such a small issue - I'm sure one of you html geniuses can sort it out - (aerospace I'm looking at you ;p) - I've been away from client side work for far too long.

Nov 27th, 2006, 09:38 PM
I don't think you can put conditional comments directly into a stylesheet because they are html comments not css comments. For min-height to work both html and body need to have a set height of 100% height, min-height will not work for those, then the #wrap div needs to have min-height of 100%.

Nov 27th, 2006, 09:44 PM
Bah... ie6 sucks :( But I dont have it anymore so I cant check these things.

...How did I know you'd be the first to answer ;) Do you live here?

Ok, I took out the conditional comment and put html and body to height:100%; now #wrap is the full height but not #main

Nov 27th, 2006, 09:49 PM
min-height in percentages will only work if the parent element has a set height of 100%.

You can run standalone IE browsers.

To get them working as if they were installed like normal you'll need to do a few registry tweaks.


Nov 27th, 2006, 10:02 PM
so, basically its not possible to do what I'm trying to do? Having 2 divs that are min-height:100%
Herm... guess I need to rethink the design then

Nov 27th, 2006, 10:31 PM
Well your transparent png already doesn't work in IE6. I say make these two images into one graphic, probably a png for the transparency and since your layout is a fixed width it won't be to hard to combine them.


Nov 27th, 2006, 11:40 PM
...never thought of that ;)
Well I wasnt entirely decided on the fixed width anyway - but percentage widths are always too small in 8x6, but I suppose I could always make it like 2000px wide, since its only 1px high