Google Chrome中的最大宽度与最大高度

Question

我正在尝试根据容器高度仅使用CSS调整图像大小。这是代码和fiddle。

<div id="first">
<img src="http://www.helpinghomelesscats.com/images/cat1.jpg" width=360 height=360>  
</div>​

#first {
    height: 100px;
}
img {
    max-height: 100%;
    width: auto !important;
}

设置max-height在Chrome中不起作用。图像变平了。在Firefox和IE中它看起来不错。 但是，设置max-width适用于所有浏览器。

#first {
    width: 100px;
}
img {
    max-width: 100%;
    height: auto !important;
}

有人可以告诉我，如何获得最大高度的正确结果，这也适用于Chrome？

Answer 1

有趣的是，Chrome似乎没有用“auto”覆盖固定宽度，即使Inspector说它确实如此。

最简单的解决方案是不指定图片的width和height属性。