2014年05月31日(Sat)
CSSを使ってDIVでtableを組む
tableと言うか、横並びにしたDIVの高さを揃えることが出来るstyleタグです。
CSS
.table{ /* 親要素 */ display: table; /* 均等幅 */ table-layout: fixed; /* 幅 */ width: 100%; /* ボーダー */ border:1px solid #CCCCCC; } .table .td{ /* 子要素 */ display: table-cell; /* 中央寄せ*/ text-align:center; }
HTML
<div class="table"> <div class="td">左側のDIV</div> <div class="td">中央のDIV</div> <div class="td">右側のDIV</div> </div>
サンプル
左側のDIV
中央のDIV
右側のDIV
コメント(0件)
CSSを使ってDIVでtableを組むに対するご意見、ご感想、情報提供など皆様からのコメントをお待ちしております。 お気軽にコメントしてください。
コメントフォーム