2012-04-13 4 views
0

4x4 라디오 버튼 표가 있습니다. 첫 번째 행 (4x4 위의 추가 행)에서는 단추를 가로로 가운데에 배치하고 싶습니다. 나는 colspan 등을 시도했지만, 다른 모든 열과 같은 열에 라디오 버튼을 남겨 둡니다.표 셀 간격 띄우기

이 같이

답변

0

? 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> 
1

필수 표가없는 답변 :

<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/