縦の中央寄せはいつも軽くハマる・・・

こんな感じで。 ポイントとしてはline-heightでボタンの高さと同じに指定するという方法もあるが、 こちらは２行になったときに対応できない、ボタンの高さに変更したときにこちらも変更しないといけないといけないので 変更に弱い。

そんなときflexでもできるという文を見つけました！

flexでやってみた。

.button-tag
    display: flex
    align-items: center
    justify-content: center
    width: 100px
    height: 100px

感想

さすがflexだぜ！！