テーブル セル内のテキストを垂直方向に中央揃えにするvertical-align: middle
には、td
.
ただし、上記は、div、スパン、ヘッダー、およびその他の非テーブル要素では機能しません。では、そのような要素のテキストを垂直方向に中央揃えにするにはどうすればよいでしょうか?
テーブル セル内のテキストを垂直方向に中央揃えにするvertical-align: middle
には、td
.
ただし、上記は、div、スパン、ヘッダー、およびその他の非テーブル要素では機能しません。では、そのような要素のテキストを垂直方向に中央揃えにするにはどうすればよいでしょうか?
1 行のテキストの場合は、行の高さを要素と同じ高さに設定できます。
多くの可能性があり、それぞれに長所と短所があります。
これは Douglas Heriot による 5 つの他の方法を説明し、それらを比較した優れた記事です。
次のスタイルを使用してください。
<style type="text/css">
div {
vertical-align: middle;
display: table-cell;
}
</style>
このように、テーブルセルとして「表示」div
し、テーブルセルでvertical-align
機能するため、テキストは中央から垂直に配置されます。