画像の下にできる隙間 - Webtech WalkerCSSでコーディングしているときに画像の下に謎の隙間ができることがあります。今回はその原因と対象方法について書きたいと思います。実際、以下のようになります。 ソースは以下です。 <div> <img src="/sample/image/sample.gif" alt="sample" />abcdefg </div> div{ background:#F00; width:200px; } この現象の原因はCSSのプロパティでインライン要素の垂直位置を指定する、vertical-alignにあります。このvertical-alignのデフォルト値は、IEなどのメジャーなブラウザではbaselineに設定されているからです。vertical-alignの値の意味は下記サイトに載っていました。 vertical-align－スタイルシートリファレンス つまりgとかjとか下にはみ出るアルファベ
