CSS min-height hack IE
Although IE (Internet Explorer) 5 and 6 don’t understand the CSS min-height property they can easily be made to understand it by simply using height instead. They will treat height almost as though it were min-height and will expand an element that contains its content even though the height has been set.
I’ve never been one too keen Grey’s css min-height hack, mainly because of the bulky workaround in your html. Sure hacks can cause bulkier CSS, but I’m ok with that. The problem with Grey’s is that it’s not only a ‘CSS‘ hack (which I’m totally fine with), but it also involves changing your html. I’m none too delighted that you need to add two separate empty div elements just to get this working correctly. Nevermind the matter, he thought of this ages ago when I was still learning how to count to twelve on sesame street. Ok so I learned that like last year, I’m catching on.
#minheight {
min-height:400px;
display:table;
height: auto !important; /* for modern browsers */
*display: block; /* for IE5.x and IE6 */
_height: 400px; /* for IE5.x and IE6 */
}
Assuming IE6 will not fix the correct implementation for the !important declaration and assuming that if IE7 does, they’ll also implement min-height correctly since at the pace they’re going they’re fixing CSS like mad crazy cows.
The above snippet of CSS works like a charm in IE6, Mozilla/Firefox/Gecko, Opera 7.x+, Safari1.2
