divのテーブルで非対称な行と列

Question

divを使用してテーブルを作成しています（divは複雑な設計なのでdivです）。 私は複数の列を持つために私の最初の行にしたいと2番目の行は、全体の行にまたがる単一の行であり、次の行は再び複数の列の行です。

この第1行、第2行は静的ではなく、データから動的に決定されます。

マイCSS：

#table-holder { 
    margin: 0 auto; 
    display: table; 
    border: solid 2px #b7ddf2; 
    background: #ebf4fb; 
    font-family: Verdana, Geneva, sans-serif; 
} 

#row { 
    display: table-row; 
    border: solid 2px #b7ddf2; 
    padding: 2px 2px 2px 2px; 
} 

#column { 
    display: table-cell; 
    border: solid 2px #b7ddf2; 
    padding: 2px 2px 2px 2px; 
} 

私のhtml：

<div id="table-holder"> 
    <div id="row"> 
    <div id="column"> 
    </div> 
    <div id="column"> 
    </div> 
    <div id="column"> 
    </div> 
    </div> 
    <div id="random"> 
     I want this to span for my whole row, instead of just 1st column. 
    </div> 
    <div id="row"> 
    <div id="column"> 
    </div> 
    <div id="column"> 
    </div> 
    <div id="column"> 
    </div> 
    </div> 

任意のアイデア？

が、これは本当にのdivがために作られているものではありませんので、あなたがトラブルに実行されて、あなたに

Answer 1

ありがとうございます。それらはブロックレベルの要素です。テーブルを作成する場合は、テーブル、tr tdなどを使用する必要があります。

Thisコンテナの幅に中間行を渡しますが、探していた機能が使い果たされる可能性があります。

divを使用するように設定されている場合は、列の浮動小数点数と列のクリアメソッドを調べることをおすすめします。