IEで画像の上部に余白が空く

|

IE6やIE7で閲覧した際に、marginやpaddingを0に指定しているのに、画像の上部に謎の余白が空いている場合があります。

これは、フォントのサイズが画像よりも大きい場合に起こります。

例えば、hタグに画像を使った場合、特にフォントのサイズは指定しないと思うのですが、実際にはブラウザのデフォルトのフォントサイズが適用されていますので、IEではその分の大きさの領域を占領してしまうのです。

できるだけリセットCSSを利用して、hタグの大きさを普通のサイズ程度に小さくしておくのが無難ですね。

最近のブログ記事