谷歌瀏覽器中的最大寬度與最大高度

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中它看起來不錯。 但是，設置最大寬度適用於所有瀏覽器。

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

有人可以告訴我，如何達到最大高度的正確結果，這也將在Chrome中工作？

Answer 1

有趣的是，Chrome瀏覽器似乎並沒有被覆蓋使用「自動」固定寬度，即使督察說，它的作用。

最簡單的解決方案是不指定圖像的width和height屬性。