Cross Browser CSS Min-Height

What’s invalid about it? It relies on an invalid interpretation of the W3C DOM to work, but it looks like perfectly valid CSS to me.

or you could do thus:

height:auto !important;
height:200px;
min-height:200px;

this would put a min-height of 2oopx on all browsers. all browsers except ie6 will respect the !important flag and ignore the second height property, while ie6 will still use the second height property, then expand as needed.

Why don’t you just stop adding workarounds for IE? Rather just show a ugly red strip at the top of the page “in IE only” using its own superb conditional comments that says “please use a browser” or if it sounds rude, -> “The browser you are using is 8 years old and is unsafe! Why don’t you take a minute to upgrade to a better safer and faster browser?”

Things like that will make them (the ignorant corporates, the technically challenged, et al) to take note. Till the day you keep giving them workarounds, they’ll keep asking for more; they’ll keep telling you “But all other sites work on my IE! Why not yours? “. “Oh well, its about time you need to know sir, that those sites work, more often than not, because some poor web designer thought it more polite to keep you in the dark about what crap you’re using!”

Because your client who Is paying you to make the website may be one of those tech idiots that uses ie 6.

Indeed. And an attempt to educate them about their ignorance isn’t always a bad idea. Everyone can give it a try to make their own world a better place to work in! :)

Kamal is right………we designer should educate these OLD school people. This will help reduce ie 6 worldwide percentage and our life gets easier………

I agree with Kamal.

In the future all of my designs will display a red div layer at the top telling people to update their browser to IE 7 or 8 and recomend using Firefox.

The rest of the website will then be displayed below and if it does not work I’m not goin to care.

You guys don’t actually do work for real clients, do you?

To say “Screw them, I’m making MY life easier by putting an ugly red message up there, and if they don’t upgrade, tough poo”, is a very irresponsible thing to do, as a web developer. There are plenty of valid reasons why a client cannot upgrade from IE6. I hate it just as much as the next person, but it’s a fact of life if you work for a company.

I tell you what – making things work in IE6 is not hard. I don’t even think about it when I code – I just adhere to the standards and use my extensive HTML/CSS knowledge and my implementations work nearly perfectly in IE6.

So… why don’t you just learn something and figure it out instead of being a lazy ass? Here’s a start – Google “progressive enhancement”.

we can also use ,

height: 319px;
overflow: visible;

height is supported by IE6 so we use height and for extra part we can use overflow: visible;

@ Chandan Khandelwal

Thanks a lot! This did it for me! After searching for a solution to fix the height-problem in ie.. I can move on.. =D

Thanks for the tip!! I have run into this problem with some annoying clients where they are still using IE 6 and sometimes 5.

Hello Kamal,chandrakant and Arnar
As David had already said even though IE 6 giving web developer problem about browser compatible we shouldn’t forget about the clients and the website users . who was still using old IE 6 browser so we should keep in mind while working the project So if there is solution then why donot we use IE Hack .
Thanks David Walsh for your min-height article.

i tried all the versions in the comments, but they not worked (perfectly) for me.
the only hack that worked perfectly is this:

#container { min-height:500px; } * html #container { height:500px;overflow:visible;}