* html 코드
<!-- 버튼들이 위치할 td -->
<td>
<!-- 버튼들을 한 덩어리로 묶는 div -->
<div class="inGridBtns">
<!-- 버튼들. background 이미지로 버튼임을 표현함 -->
<div onclick="a()"></div>
<div onclick="b()"></div>
<div onclick="c()"></div>
</div>
</td>
* css 코드
.inGridBtns {
display:inline-block; /* inline-block이어야 자식객체의 내용에 따라 가변적인 크기를 가질 수 있다. */
cursor:pointer;
height: 16px /* 버튼의 height의 근사치로 입력해야 버튼에 fit되어 수직 가운데 정렬이 된다. */
}
/* IE7(호환성보기)에서 inline-block이 작동하지 않으므로 hack을 사용하여 inline-block 구현 */
*:first-child+html .inGridBtns{
display:inline; zoom:1
}
.inGridBtns div{
float:left /* block 속성 엘리먼트의 정렬은 float를 사용한다. */
}