Good table practice - best way to do headers in a table?

Question

I basically have a table of data and I want to set the spacing so it's not all cramped together. However I want the title bar of the table (first row) to ignore the cell padding rules.

Is there a good way to do this? Or do I have to create a seperate table or something for the header?

Answer 1

The 'title bar' sounds like the ideal content for a <caption> element.

Answer 2

Yes, in your CSS:

table thead th { padding: 0; }
table tbody td { padding: 15px; }

assuming:

<table>
<thead>
<tr>
  <th colspan="4">Big Heading</th>
</tr>
</thead>
<tbody>
<tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
  <td>4</td>
</tr>
</tbody>
</table>

Answer 3

You can use th instead of td for the table cells in the table header. Then you can define seperate styles for the header and for the body cells.

Answer 4

Use thead and tbody.

Apply padding styles for tbody only.