画像を縦に並べた時の隙間を無くする


画像をリスト要素でマークアップした場合、デフォルトの状態では縦に隙間が生じます。

隙間を無くすにはimg要素に対してvertical-align:bottom;、またはvertical-align: top;を指定します。

<ul class="talelist">
<li><img src="tatelist.png" /></li>
<li><img src="tatelist.png" /></li>
<li><img src="tatelist.png" /></li>
</ul>
.tatelist {
list-style-type: none;
}

.tatelist li img {
vertical-align:bottom;
}

コメントを投稿する

SPONSORED LINK

CATEGORY

RECOMMEND BOOKS

OTHER

あわせて読みたい

トップへ戻る