SHERBETS|SHERBETS


画像の下にできる余白をなくす

marginを0にしても画像の下にできてしまう余白をなくす方法の備忘録です。

○ 画像の下にできる余白をなくす

  1. 下記CSSを実装。

CSSサンプル(vertical-align: bottom;を設定する)

CSSサンプル(block要素にする)

これで画像の下にできる余白がなくなります。
画像はインライン要素なのでベースラインに配置され、結果余白ができてしまいますので、下揃えにするかブロック要素にすることで解決します。
ブロック要素にするとtext-alignでのセンタリングが効かなくなりますので、margin:0 auto;でセンタリングする必要があります。
参考にした記事はこちら

にほんブログ村 ゲームブログへ



○ コメントを投稿する

▲TOP