[html] CSS td 너비 절대, 위치 사용

이 JSFIDDLE을 참조하십시오

td.rhead { width: 300px; }

CSS 너비가 작동하지 않는 이유는 무엇입니까?

<table>
<thead>
<tr>
<td class="rhead">need 300px</td>
<td colspan="7">Week #0</td>
<td colspan="7">Week #1</td>
<!-- etc..-->
</tr>
<tr>
<td class="rhead"></td>
<td>S</td><td>M</td><td>T</td><td>W</td><td>T</td><td>F</td><td>S</td>
<td>S</td><td>M</td><td>T</td><td>W</td><td>T</td><td>F</td><td>S</td>
<!-- etc... -->
</tr>
<thead>
</table>

또한 위치 : 고정, 절대 등이 td 너비에 미치는 영향은 무엇입니까? 나는 수정 이상의 이유를 찾고 있습니다. 어떻게 작동하는지 이해하고 싶습니다.

답변

<td><div style="width: 300px;">wide</div></td>

    table {
        width: 100%;
        table-layout: fixed;
    }

    .header-row > td {
        width: 100px;
    }

    td.rhead {
        width: 300px
    }

body {min-width:4150px;}

table{
    width:5000px;
}

<table>
<thead>
<tr>
<td width="300">need 300px</td>

table {
  table-layout: auto;
}

table {
   table-layout: fixed;
   width: 300px; /* your desired width */
}

td:nth-child(1), td:nth-child(2) {
   width: 15%;
}