w6500 https://blog.hatena.ne.jp/w6500/ tanihiro.log https://tanihiro.hatenablog.com/ css 先日書いたブログに、先輩がこんな風にコメントしてくれたにもかかわらず、がっつりハマったので戒めのためにもメモしておきます。 なにが起きたか 要件としては、高さの違う2つのボックスを横並びにして、上下中央寄せにする、というものでした。 <div class="wrapper"> <div class="left">左は<br>二行</div> <div class="right">右は一行</div> </div> .wrapper div { float: left; } とりあえず、横並びだからfloatを指定して、上下中央寄せはvertical-alignを使えばいっかと思っていたら、全然… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Ftanihiro.hatenablog.com%2Fentry%2F2014%2F04%2F01%2F002342" title="【css】floatとvertical-alignを併用しようとしてがっつりハマった話 - tanihiro.log" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> http://cdn-ak.f.st-hatena.com/images/fotolife/w/w6500/20140331/20140331235924.png Hatena Blog https://hatena.blog 2014-04-01 00:23:42 rich https://tanihiro.hatenablog.com/entry/2014/04/01/002342 1.0 100%