CSSで縦割りのカラムを設定する

CSSで縦割りのカラムを設定する方法の覚書

以下のサイトを参照。

divタグを用い、ブロック単位で横並びにする。


CSSファイルには以下のように記述。
この記述は、1000pxの横幅を均等割りする記述。
[php]
.dtable{
display: table;
table-layout:fixed; /* ブロックレベル要素を均等に配置 */
width:1000px; /* ブロックレベル要素全体の幅 */
}
.dtable_c{
display: table-cell;
border: 0px solid #666;
}
[/php]

HTMLページには、以下のように記述して各ブロックを均等割りする。記述した分のブロック数で均等割りされる。2つなら二等分、5つなら五等分。
[php]

第一ブロック
第二ブロック
第三ブロック
第四ブロック

[/php]


[記述例]

記事の共有: