min-height in ie6

[sudhakararaog]

in my layout i need to use min-height and i noticed that ie6 does not support ie6, so for all browsers i have

#contentouter{
float: left;
width: 915px;
min-height: 500px;
height: auto;
}

for ie6

* html #contentouter{
height: 500px;
overflow: visible;
}

by using min-height in all browsers the contentouter div always has a minimum height of 500px and whenever content exceeds 500px the contentouter div grows automatically in all browsers and also in ie6

is this the right way to use min-height in all browsers and in ie6 with the above code i have used

please advice.

thanks

[Fang]

Don't use hacks, use conditional comments (http://msdn.microsoft.com/en-us/library/ms537512%28VS.85%29.aspx)<![if lt IE 7]>
<style type="text/css">
#contentouter {height:500px;}
</style>
<![endif]>

[sudhakararaog]

thanks for replying

any reason why hacks should not be used as i am able to get the desired output by writing a hack and not using conditional comments

also can you let me know if the procedure i have used for min-height for all browsers and ie6 is correct

[Fang]

Use conditional comments, they are version proof and don't affect other browsers.

[Jeff Mott]

To answer your original question, sudhakararaog: Yes, using height to mimic min-height for IE6 is exactly what you need to do.

As for the conditional comments, some developers feel very strongly one way or the other, but on the whole, it seems to be a gray area among developers.

Conditional comments are supposed to be safer. They affect only IE, and then only the version you specify. Hacks can also target a particular version of IE, but the worry is that some future version may regress and start reading the hack again, and that means we would need to update our CSS.

I don't think hacks are a bad choice. For now, they work perfectly well, and it seems unlikely to me that a future browser will start reading the hack again. And even if one did, it doesn't make much difference because I've never seen a new IE browser that I didn't need to update code for anyway.

I even prefer hacks because it lets me keep my CSS centralized, rather than artificially split across multiple files.

An aside... over the years, people have discovered more convenient hacks. You may like the underscore hack for targeting IE6.

#contentouter {
float: left;
width: 915px;
min-height: 500px;
_height: 500px; /* IE6 */
}

[sudhakararaog]

thanks for letting me know