偏移表格单元格

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/