<table>
<tr>
<td style=”width:30%;”></td>
<td colspan=”3″></td>
</tr>
<tr>
<td style=”width:30%;”></td>
<td style=”width:30%;”></td>
<td style=”width:10%;”></td>
<td style=”width:30%;”></td>
</tr>
</table>
만약에 이렇게 디자인을 할 경우에
첫 번째 줄의 사이즈는 제대로 표시되지만,
두 번째 줄의 사이즈는 제대로 표시가 되지 않는 현상이 있습니다.
(width값이 무시되고 균등하게 분할이 되어버립니다.)
이런 경우에는 아래처럼 하면 해결됩니다.
<table>
<colgroup>
<col style=”width:30%;”>
<col style=”width:30%;”>
<col style=”width:10%;”>
<col style=”width:30%;”>
</colgroup>
<tr>
<td></td>
<td colspan=”3″></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
또한 colgroup에서 사이즈를 지정해준 경우에는
하부에 있는 td에는 사이즈를 지정하지 않아도 적용됩니다.
Yongeun Park 