As you might know, Safari 1.2, doesn't support min-height. While some people don't really care about the Mac (like me, although I would want one) and others do I found a solution after I gave up. A person, who doesn't see that much value in web standards, made a comment about the Safari failure (the complete site was readable, only visually not the same as Mozilla) and concluded that my CSS knowledge wasn't sufficient. Of course, I didn't like that comment and started thinking how he would have solved the problem which led me to tables, obviously.
I immediately thought of how I hate the CSS table model and directly after that I saw how it could solve my problem. Read these lines:
In CSS 2.1, the height of a cell box is the maximum of the table cell's 'height' property and the minimum height required by the content (MIN). A value of 'auto' for 'height' implies a that the value MIN will be used for layout.
All I had to do to make min-height work cross-browser, was using something else:
div{
display:table-cell;
height:100px;
}
Internet Explorer will ignore the display property (actually, it treats it like display:block;) and will handle height as min-height, since IEs handling of height is stupid.
All other browsers, including Safari (see the support charts) will make the DIV element behave like a table-cell (and create some anonymous elements around it), which makes the rules of the quote apply and everyone is happy!
Now that's css hacking at it's best! Kinda cheeky, too.
On a side note, David Hyatt has implemented support for min-height and max-height in Safari
Your site is unreadable on IE5-Mac. None of the body copy shows up, only the menu. I'm writing this from home. Firefox/Linux, where it works beautifully. Nice hack, too, btw.
Why, though, do I have to use HTML to post a comment? Isn't that a bit user-unfriendly?
Perhaps you could upgrade to Safari? ;-). I don't really care about older browsers, sorry for that. The HTML in the comments is perfectly acceptable for most of my audience.
Wow it really works!
Alas Opera 7.0 which I have to support kinda messes things up :(
I'm just going back to min-height. Safari will support it soon enough (as Gilles mentions) and the design I'm working on won't die horribly