chaloowsスタッフBlog｜テキストを縦幅中央配置する方法

先日、CSSでテキストを縦幅(height)中央に配置する方法を聞かれたんです。 う～ん、そういえば僕もCSSを覚えたての頃は頭を悩ませた部分でした。 よくナビゲーション部分などで引っかかりました。 ここから続き text-alignプロパティを使用することで、横幅(width)の位置を指定できるのだから、 vertical-alignプロパティで縦幅も指定できないかと。 しかし、vertical-alignプロパティが適用できるのはインライン要素とテーブルのセル要素なんです。 じゃあ、どうすれば縦幅の中央にテキストを配置できるかですが、 方法はボックスの高さと同じ数値をline-heightプロパティに指定すれば良いんです。 ---------------- サンプル ---------------- ----【まとめ】----- 高さ50pxのブロック要素内で、縦幅の中

[picnicgraphic]

「ボックスの高さと同じ数値をline-heightプロパティに指定/残念なことに文字が複数行にまたがる場合には対応していません」