table-layout
table-layoutプロパティは、テーブルのセル、行、列をレイアウトする際に、どの様なレイアウトを用いてテーブルの横幅を計算するかを指定します。
- 対応ブラウザ
-
プロパティの解説
- 値
- auto|fixed|inherit
- 初期値
- auto
- 適用される要素
- テーブル要素
- 継承
- しません
- パーセント値
- N/A
- メディア
- visual
値の解説
- auto
-
任意の自動レイアウトアルゴリズムを使用する。
このレイアウトはUA(ブラウザなど)は任意で決めてよい事になっているのでそれぞれのUAに寄って変わる場合が有ります。
なお、多くのUAではwidthプロパティの指定が無い場合、セルの内容量に合わせて横幅が広がります。 - fixed
-
固定レイアウトアルゴリズムを使用する。
このレイアウトは、テーブルの水平方向のレイアウトがセルの内容量に依存しません。代わりに、テーブル全体の幅、列幅、ボーダー、セル間の影響を受けます。通常、widthプロパティの指定が必要になります。
なお、widthプロパティの指定が無い場合、IE6, 7は横幅が100%になってしまいます。
これら、レイアウトアルゴリズムに関してより詳しく知りたい方は、仕様書の表の幅を計算する辺りをお読みください。
table-layoutのサンプル
table.sample01 {
table-layout: auto;
}
table.sample02 {
table-layout: fixed;
}
このサンプルを今見ているブラウザで表示すると以下のようになります。
- サンプルのブラウザ上の表示
-
auto
タイプM タイプL 価格 265万~ 291万~ fixed
タイプM タイプL 価格 265万~ 291万~