2025年4月24日

完璧に覚えることができてない･･･
名前にalignがついてるのに普通のalignとは使い方が大きく異なるというのが間違える原因か･･･


検索しても上のほうに出てくるサイトでは解決しなかったから解決したサイトのURLを控えておこう･･･
https://learning.mihune-web.com/vertical-align/


前にハマった時もテキストと画像の縦中央揃えでハマった気がする。
大体はimgに対して使うことで配置した画像に対して中央揃えされる感じ。
　親要素に対して使うんじゃなくて、そのブロックの中で基準とするものに対して使うということのようだ･･･（テキスト側に使ってもならなかったので、最も大きい要素に対して指定してやる感じ？）　


しかしimg（縦32）とbuttonの組み合わせで、buttonにvertical-align:middleとheight:81pxを指定してやったけど画像がずれちゃった。



buttonのvertical-align:middleを外してimgにvertical-align:middleをつけたところ、やっぱりずれる。



そこで、buttonとimgの両方にvertical-align:middleをつけたところ、完璧に縦中央揃えになった。



なるほど分からん。
とりあえず親要素につけるもんじゃないってことを覚えておけば全く効かないという状況にはならないだろう･･･

コメントをどうぞ