如何使用一系列ID的CSS設置表格

Question

我正嘗試在CSS中使用系列樣式的div ID創建表格。我真的很麻煩風格的div。有人能告訴我，如果我以正確的方式接近這一點嗎？

考慮到'表'將被用來檢索實時數據，很有希望！所以我可能需要列寬自動調整以適應生成的字符串的字符長度。

----------------------------------------------------------------------------------------- 
            Top Column 
----------------------------------------------------------------------------------------- 
    Column one   |    Column two    | Column Three   

HTML

<div id="container"> 
      <div id="top_row"> 
       <h3>Top row</h3> 
      </div> 
       <div id="column_one"> 
        <h3>column one</h3> 
       </div> 
       <div id="column_two"> 
        <h3>column two</h3> 
       </div> 
       <div id="column_three"> 
        <h3>column three</h3> 
       </div> 

      </div> 

CSS

#container { 

    display: table; 
    border:1px solid #dedede; 
    } 

    #top_row { 
    display: table-row; 
    } 

    #column_one, #column_two, #column_three { 

    display: inline-block; 
    text-align: center; 
    margin-top:50px; 
    margin-left: auto; 
    margin-right: auto; 
    letter-spacing:1.5px; 

Answer 1

我不明白爲什麼不能。我想補充一個適當的一行底部，雖然：

http://jsfiddle.net/isherwood/jcg8Y/

<div id="container"> 
    <div id="top_row"> 
     <h3>Top row</h3> 

    </div> 
    <div id="bottom_row"> 
     <div id="column_one"> 
      <h3>column one</h3> 

     </div> 
     <div id="column_two"> 
      <h3>column two</h3> 

     </div> 
     <div id="column_three"> 
      <h3>column three</h3> 

     </div> 
    </div> 
</div>