0

コンテナーの高さに基づいて、CSS のみを使用して画像のサイズを変更しようとしています。これがコードとフィドルです。

<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でも機能する最大高さの正しい結果を達成する方法を誰かに教えてもらえますか?

</p>

4

1 に答える 1

0

興味深いことに、Chrome は固定幅を「自動」でオーバーライドしているようには見えませんが、インスペクターはそう言っています。

最も簡単な解決策は、画像の属性widthと属性を指定しないことです。height

于 2012-11-25T18:00:15.297 に答える