画像は基本的に、私はそうのようなFlickrのから画像を取得するためのjQueryを使っIE

Question

に延伸現れる <div class="flickr"></div>

ここに私のCSSです：

.flickr  { overflow: hidden; } 

.flickr-thumb { height: 40px; overflow: hidden; float: left; } 

.thumb  { width: 60px;} 

だから、javascriptはこのすべてをオンザフライで追加し、ソースを表示すると<div class="flickr"></div>と表示されます。うまくいけば、それはかなり直感的です。

しかし、画像がIEで（特に、垂直に）伸びて表示される理由を誰でも説明できますか？

おかげで、 トムは

Answer 1

あなたのイメージタグに高さと幅の両方を指定していますか？

Answer 2

私の推測によれば、画像の元の解像度は60pxではありませんでした。 css（またはhtml width属性）を使用して幅を設定すると、イメージの縦と横のサイズが変更されません。指定した方向にのみサイズが変更されます。

このように、幅が100ピクセル、高さが100ピクセルの画像は、thumbクラスで60×100と表示され、縦方向の伸びが生じる可能性があります。

解像度（幅と高さ）を評価し、両方向を適切にサイズ変更するコードを書くか、すべての画像が固定サイズであれば幅と高さを指定する必要があります。

.thumb { width:60px; height:60px; } 

これは、いくつかのブラウザでは、（特にIE6）の結果をエイリアスますので、CSSやHTMLで画像のサイズを変更することは推奨されないことにも言及する価値があります。