如何使用CSS定位表格

Question

我有一個包含兩列的表格，右側包含3個按鈕，這些按鈕用於更改表格另一列中的內容。我希望這張桌子位於頁面的中心位置，但我無法弄清楚如何去做。

這裏是我想要的截圖（圖片顯示了一個頭了，但是這並不重要，現在）

如果有可能我想的按鈕不動的時候另一列的內容會發生變化，但這不是優先事項。

我也可以用另一個結構來改變表格，如果這有幫助的話。

下面是HTML代碼：

<div class='main'> 
<table class="table"> 
    <tr> 
     <td> 
      <input type="button" class="button" value="edit_menu"/><br><br> 
      <input type="button" class="button" value="edit_desc"/><br><br> 
      <input type="button" class="button" value="set_push"/> 
     </td> 
     <td> 
      <div id="content"> 
       <div id="edit_menu" display="none" class="form"> 

          here is a simple form 

       </div> 

       <div id="edit_desc" display="none" class="form"> 
        here is a second form 
       </div> 

       <div id="set_push" display="none" class="form"> 
        here is a third form 
       </div> 
      </div> 
     </td> 
    </tr> 
</table> 
</div> 

當按下按鈕的形式能見度通過JavaScript改變。

Answer 1

請嘗試使用以下代碼。 CSS：

body {margin:0; padding:0;} 
.wrapper {width: 500px /* width of your table*/; margin:0 auto;} 

HTML：

<div class="wrapper"> 
<!-- put your table here --> 
</div>