2009-07-16 16 views
2

私はdivの上にイメージがあり、IE(7、おそらくは6)は2つの間にスペースを置くことを主張します。どのように私はそのスペースを取り除くことができますか?IEイメージの間隔の問題

<html> 
<body> 
    <img src="http://www.google.com/intl/en_ALL/images/logo.gif" style="margin: 0; padding: 0; 
     border: solid 1px black" /> 
    <div style="margin: 0; padding: 0; border: solid 1px green;width: 276"> 
     <a href="#">More...</a>&nbsp; 
    </div> 
</body> 
</html> 

答えて

8

イメージCSSに「display:block」を追加します。

IMGが表示されます:デフォルトではインラインで、画像のみを含むテキスト行と、その下にdivが表示されます。テキストの行は、イメージの高さと等しく、現在のフォント(イメージとdivの間のスペースに由来)の降下に等しい降下を持ちます。厳密なモードでは、スペースなしで降下するでしょう。

したがって、ギャップをなくす別の方法は、line-height:0(親要素上)を指定して降下をゼロに設定することです。

3

イメージマークアップとdivマークアップを同じ行に入れてみてください。不思議ですが、これは過去に私のために働いていました。

<img src="file.jpg" /><div><p>contents</p></div> 
+1

ありがとう、それは仕事をしました...これには非ハックの修正があるのだろうかと思います。 – Jeremy

+0

私はこれを本当に「ハック」とは考えていません。 – Sampson

1

2の間> < BRを置きます。 エクスプローラは暗黙のうちに暗黙のうちに< p>を挟んでいる。

+0

しかし、それは私が避けようとしている空白を強制します。 – Jeremy

+0

私は自分のマシンにIE6しか持っていないので、空白が消えてしまった。
は、次の行に移動します。 –