Mozilla's getting a new look. What do you think? https://mzl.la/brandsurvey

table-layout

概要

table-layout は 表のセル、行、列のレイアウトアルゴリズムを定義する CSS プロパティです。

初期値auto
適用対象table および inline-table 要素
継承不可
メディアvisual
計算値指定値
アニメーションの可否不可
正規順序形式文法で定義される一意のあいまいでない順序

構文

形式文法: auto | fixed
table-layout: auto
table-layout: fixed

table-layout: inherit

auto
自動テーブルレイアウトアルゴリズムは殆どのブラウザでテーブルのレイアウトの為に用いられている基本のアルゴリズムです。テーブルとテーブルの各セルの幅はその内容に応じたサイズに設定されます。
fixed
テーブルとテーブル列の幅は、table 要素と col 要素の幅によって、 もしくは行の最初のセルの幅によって設定されます。後続する行のセルは列幅の設定に影響しません。

固定レイアウトメソッドに於いては、一度テーブルの一行目のみをダウンロードして解析した後、テーブル全体をレンダリングします。これは自動テーブルレイアウトアルゴリズムよりレンダリング速度を速くする事が出来ますが、後続するセルのコンテンツが用意された列幅に収まらないかもしれません。内容のオーバーフロー(はみ出し)が発生したセルに対して、はみ出した内容の表示方法を指定するには、overflow プロパティを用います。

.contentbox {
  table-layout: fixed;
}

仕様

仕様書 策定状況 コメント
CSS Level 2 (Revision 1)
The definition of 'table-layout' in that specification.
勧告  

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート ?  - 14.0 +  1.0 (1.7 or earlier) 5.0 7.0 1.0
機能 Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本サポート ? 1.5 ? ? ? ? 9.8.0 ? 3.0

ドキュメントのタグと貢献者

 このページの貢献者: fscholz, Sebastianz, dskmori, ethertank
 最終更新者: fscholz,