画像と画像の間に隙間（余白）ができてしまう問題解決方法

画像を縦に並べて、画像と画像の隙間のない状態で投稿しようとすると……何故か画像と画像の間に隙間ができてしまいます。

この問題はCSSの追加で解決できます。

初期状態だと、本文の入力画面で画像をくっ付けても……

以下のように隙間（余白）ができてしまいます。

これを、CSSの追加でピッタリ画像をくっつけて並べられるようにできます。

CSSの追加方法

左のメインメニューから【テーマ】を選択し【カスタマイズ】をクリックします。

そこから【詳細設定】の【CSSを追加】を選択します。

【カスタムCSSを追加】にCSSを入力できます。

後述のCSSを入力したら保存をして、反映されているか実際にブログを確認しましょう。

以下のどちらか１つを入力してください。どちらでもOKです。

img {
vertical-align: bottom;
}

img {
vertical-align: top;
}

これで、隙間（余白）がなくなります。

imgは初期状態ではvertical-align: baseline;となっており、テキストのベースラインで揃えるようになっています。

ベースラインからはみ出た部分が余白になって、隙間になってしまうというのが原因になります。

上記のCSSでベースラインからはみ出ない状態にできるという感じです。