今、Webサイトの模写を進めているのですが、CSSって案外難しい。

このボタンのテキストを左右中央、上下中央にしたいだけなのに、軽く１時間以上悩んでしまった。

勉強が足りないとだけと言われればそのとおりなのですが。

text-align: center で左右中央になるのに、vertical-align: middle で上下中央にならない。

しかし、display: table-cell とすると、 vertical-align: middle が効くようになる。

うーん。

参考

• 【CSS】displayの使い方を総まとめ！inlineやblockの違いは？
• codepenでウェブ開発入門 – Qiita