偏移表格單元格

Question

我有一個4x4的單選按鈕表格。在第一行（高於4x4的額外一行），我想要一個水平居中的按鈕。我曾嘗試過colspan等，但仍然將這個單選按鈕放置在其他列的列中，因此未經審查。

Answer 1

http://jsfiddle.net/EJbny/

<table style='width:100%;' border=1> 
<tr> 
    <td colspan=4 style='text-align:center;'><input type='button' value='hello'></td> 

Answer 2

喜歡這個？只需在頂行使用CSS和text-align:center規則。這裏有一個jsFiddle example。

<table> 
    <tr> 
     <td colspan="4" style="text-align:center"><input type="radio" /></td> 
    </tr> 
    <tr> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
    </tr> 
    <tr> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
    </tr> 
    <tr> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
    </tr> 
    <tr> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
     <td><input type="radio" /></td> 
    </tr> 
</table> 

Answer 3

強制性表少的答案：

<div> 
    <div class="center"><input type='button' value='hello' /></div> 
    <ul class="radioList"> 
     <li> 
      <label for="radio1"> 
       <input type="radio" id="radio1" /> 
       Checkbox 1</label> 
     </li> 
     <li> 
      <label for="radio2"> 
       <input type="radio" id="radio2" /> 
       Checkbox 2</label> 
     </li> 
     <li> 
      <label for="radio3"> 
       <input type="radio" id="radio3" /> 
       Checkbox 3</label> 
     </li> 
     <li> 
      <label for="radio4"> 
       <input type="radio" id="radio4" /> 
       Checkbox 4</label> 
     </li> 
    </ul> 
</div> 

.center { text-align:center; } 
.radioList { 
    list-style:none; 
    width:100%; 
} 
.radioList li { 
    float:left; 
    width:25%; 
} 

http://jsfiddle.net/Amudt/