DIVなどのBOXにテキストを縦に中央配置する
いつもテキストを縦に中央配置するときに困っていて、解決方法
を探していた。今回、方法を見つけたのでメモ
vertical-align を使えば中央配置できるのだが
これはテーブルセルのプロパティなので正しく動作しない。
そこで方法としては
display:table-cell; を使う。
IEは
display:inline-block; と同じ効果を与える。
方法は
display:inline;
zoom:1;
vertical-alignの使い方【css tips】
line-height で親ボックスと同じ高さの値を指定してあげる。
ここで問題発生！
これだと2行以上の文には無理っぽい。
2行以上の場合は
CSSで垂直中央を実装する【css tips】
positionを使うそうです。