CSS min-height attribute - problems in IE

Hello,

I'm having trouble using the min-height attribute in a style sheet. I'm trying to apply it to a div so that a footer doesn't come up and cover up a menu when the content isn't long enough. It works fine in Firefox, but IE doesn't even seem to notice it's there. And the funny thing is, when I type in min-height on google, the first thing that comes back is an article on Microsoft's MSDN website.

Can anyone help me identify why it isn't working properly? Thanks.
carter_jlAsked:
Who is Participating?

[Webinar] Streamline your web hosting managementRegister Today

x
 
OliWarnerConnect With a Mentor Commented:
IE (6) doesnt cope with min-height because its not implemented.

You can hack around it with something like this:
http://www.cssplay.co.uk/boxes/minheight.html

You must appreciate that it *is* a hack and probably will not validate, but if it works, it works.
0
 
carter_jlAuthor Commented:
I don't quite understand how to use that code pertaining to a div and exactly where to put what in the style sheet. Can you elaborate a little further?
0
 
carter_jlAuthor Commented:
Nevermind, using that code I found a better help page for it. Thanks.
0
 
OliWarnerCommented:
Sure. The sample code is coding for an element with a class name of "container". That's the element that its trying to set the minimum height for.

/* for understanding browsers */
.container {
min-height:8em;
height:auto;
}

/* for Internet Explorer */
/*\*/
* html .container {
height: 8em;
}
/**/

So what that's really doing is setting the minimum height for any browsers that care to understand it. The second part is coded that only IE will read the code contained between the "/*\*/" and the "/**/"

It sets the height manually and because IE will auto-stretch, this works like it were min-height. mOther browsers might try to enforce the height, therefore its coded so only IE can read it.

All you really need to do to get this working in your code is swap out the ".container" part for the class name you're using on your element. If you need more help with that, chuck me a link to the page or put up the relevant CSS and HTML.
0
 
OliWarnerCommented:
Oki =) Glad you found some use of it.
0
All Courses

From novice to tech pro — start learning today.