Search code examples
csswidthcss-tables

th and td width are different

I am trying to have my table header be static, but whenever I do this the th and the td widths end up changing. I am doing all of this using CSS. The way that I am making the table header static is by making its position fixed.

I have tried setting the th and td widths to be the same, but that doesn't work.

#idOfHeader th { width: 20px; }
#idOfBody td { width: 20px; }
Solution

  • Use col tag in html

    <table border="1" width="100%">
  <col width="100">
  <col width="50">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80</td>
  </tr>
</table>

    fiddle