Internet Explorer中没有履行最大宽度或最大高度

HTML：

<div id="thumbnail-container"> 
    <img src="sample-pic.jpg"/> 
</div>

CSS：

#thumbnail-container img { 
    max-height: 230px; 
    max-width: 200px; 
}

在这个例子中，sample-pic.jpg实际上是320x211。

在Firefox 11.0中，此代码完美无缺，FF将sample-pic.jpg调整为CSS规则中规定的230x211 max限制。

但是，在IE 9中，max-height和max-width规则完全被忽略，图像呈现为其通常的320x211大小。

如何修改HTML/CSS，使IE 9和FF 11.0都能够遵守这些最大限制？提前致谢！

IE7 +支持max-width和max-height。

检查你页面的标准模式下运行。（确保有一个有效的doctype）

2012-04-23 19:34:57

给这个教程一试：

该解决方案还应该工作在FF。

2012-04-23 19:31:33

这些黑客只是需要支持IE6。 – josh3736 2012-04-23 19:38:51

确保您已经声明了一个DOCTYPE并没有输出或在它之前的空白。例如，这是HTML5的DOCTYPE，它应该在你的输出的最顶部去：

<!doctype html>

而且，如果IE是在兼容模式下，可能会导致问题。尝试添加以下到您<head>：

<!-- Forces user OUT of IE's compatibility mode and removes "broken page" icon --> 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

编辑：我能测试，并且似乎没有doctype确实事业最大宽度不工作。兼容模式似乎没有影响它（在这个问题上）。

2012-04-23 19:43:22 CWSpear

是的..没有文档类型使IE渲染怪癖模式..这是问题.. – 2012-04-23 19:53:32

谢谢你！ – Unconquered82 2015-11-17 16:13:18

回答