金曜・日曜 8:30から 朝ヨガ開催中!

html5における、画像下のすきまについて

HTML

2014.06.18

html5で書いた時に、どうしてもimgの下にすこーしすきまができてしまう。

にゃんだ?にゃんだ?と調べてみると、
画像のボトムはテキストのベースラインに合わせているのだとか。

ベースラインとか言われても、2バイト文字の日本語環境では
これまたにゃんだ?にゃんだ?という感じだが、
つまり google における g とか yahoo における y みたいに、
他の文字より少し下にさがる文字がある場合にできる空間が、
予め取ってある、というようなことっぽいのだ。
(私の解釈が間違ってるかもしれないけど・・・)

というわけで、ベースラインを g や y の下と捉えていただき、
予期せぬ余白を消すためにできる、2014年現在の方法はこちら。

img {vertical-align: bottom;}

ほむぅぅん。。

Tags:,