トップページの中の プロパティの中の Tのプロパティ一覧の中の table-layout

table-layout

  • 最終更新:2009年10月 7日 23:47

table-layoutプロパティは、テーブルのセル、行、列をレイアウトする際に、どの様なレイアウトを用いてテーブルの横幅を計算するかを指定します。

対応ブラウザ
  • IE6一部対応
  • IE7一部対応
  • IE8対応
  • Firefox3.5対応
  • Opera10対応
  • Safari4対応
  • Chrome3対応

プロパティの解説

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万~

このページの上部へ