質問: 下記のソースコードについてなぜ「a」にvertical-alignを指定しているにもかかわらず、「b」が中央寄せされているのでしょうか。 https://codepen.io/gtrtretyrey/pen/Pvjxex
回答: `verttical-align`は、要素の**ベースライン**(並べるときの基準線)をどこにするか設定するものです(MDN)。 ということで、`.a`だけ`verttical-align:middle`をかけると、`.a`のベースラインが中央になり、デフォルトの`.b`のベースライン(日本語文字の下部)と揃います。