How to make max css width in IE6 and 7?

Question

I am using this css code on my website:

img { max-height: 800px; max-width: 600px; } 

Unfortunately, it does not work with IE 6 and 7. How can I solve it?

Thanks in advance.

Answer 1

• The max-height property is supported in IE7: http://www.w3schools.com/cssref/pr_dim_max-height.asp , and you can use IE7 to check its this link .

• IE6 and earlier do not support the max-height property. But you can use CSS to crack it:

   img { max-height: 800px; _height:expression(this.scrollHeight > 800 ? "800px" : "auto"); /* sets max-height for IE6 */ max-width: 600px; _width:expression(this.scrollWidth > 600 ? "600px" : "auto"); /* sets max-width for IE6 */ } 

2.1. Solve it with jQuery:

 if($.browser.msie&&($.browser.version == "6.0")&&!$.support.style){ $("img").each(function(){ if($(this)[0].scrollHeight>800) $(this).css({"height":"800px","overflow":"hidden"}); }); } 

Update 2012.11.27 :

 img{ min-height:800px;height:auto !important;height:800px; min-width:600px;width:auto !important;width:600px; } 

Answer 2

You can get the minimum and maximum width / height for working in older IE: http://javascript.about.com/library/blwidth.htm