CSS 画像を設置した時にできる隙間をなくす

marginやpaddingを0に設定してるのに…なぜだ…(汗)


この余白を消すには、vertical-alignプロパティを指定します。

<div style="text-align:center; background:white">
<img style="vertical-align: bottom;" src="img/photo.jpg">
</div>

bottomでなくても、top,middleでもOK


vertical-alignプロパティを使っても隙間が消えない場合は要素サイズが余分に大きい可能性があるため、line-heightプロパティを併せて指定する。


画像だけのサイトを作っていますが…
そうなると隙間をなくしたい。

横のズレなどは、全角スペースが原因で崩れることがある。
テキストエディターは、全角スペースが認識できる機能、設定が望ましい。

つづく

コメント