このCSSを作成するには？

Question

私はdivを従わなければならない：

<div id="cont"> 
     <div class="row"> 
     <div class="col">1</div> 
     <div class="col">example.com</div> 
     <div class="col">text1</div>     
     <div class="col"><b>text1</b></div> 
     </div> 
     <div class="row"> 
     <div class="col">2</div> 
     <div class="col">example2.com</div> 
     <div class="col">text2</div>     
     <div class="col"><b>text2</b></div> 
     </div> 
    </div> 

私は、この「表」のCSSの記述方法を理解したいと思います。

私はclass="col"ニーズが浮かぶと思う：左を（それぞれのdiv becase水平に、連続している必要があります）が、どのように

がclass="row"を書くのか？

EDIT：

<table> 
    <tr> 
    <td></td> 
    <td></td> 
    <td></td> 
    </tr> 
    <tr> 
    <td></td> 
    <td></td> 
    <td></td> 
    </tr> 
</table> 

が、私は唯一のdivを使用していることを実行する必要があります。私はテーブルを望んでいない、私は同じと思うが必要なので、私は「表」を書きました。

Answer 1

：

.row{ 
    display:block; 
} 

.col{ 
    display:inline-block; 
    width:200px;/*for example*/ 
} 

Answer 2

ただ、人々はあなたがテーブルを使用してはならないと言うとき、彼らはレイアウト構造を参照しているtable

を使用しています。この場合でもそれを使用するのは依然として問題ありませんが、悪ではありません！

Answer 3

次のようにCSSを使用してください。これらはあなたのDIVを表のように見せます（http://jsfiddle.net/H7NQV/）。あなたの例は表形式のデータのように見えるので、テーブルを使うことをお勧めします。
<table>タグは、CSSで実装されていない機能（たとえば、colspanおよびrowspanなど）をサポートしています。

私はあなたのCSSがあるべきだと思う

.cont { 
    display: table; 
} 
.row { 
    display: table-row; 
} 
.col { 
    display: table-cell; 
} 

Answer 4

はどのようにあなたのクラスrowがレンダリングされることになっていますか？私はそれがまったく構成していないと正しく見えるはずだと思います。とにかく、表形式のデータには表を使うべきです。

Answer 5

CSS tables vs. HTML tablesについてこの投稿をお試しください。これはどのようにあなたの質問に答える必要があります。また、あなたのケースでは単純なテーブルの代わりにcssテーブルを使用することから本当の価値を得るかどうかを検討するでしょう。