CODEWITHSUNDEEP
html
Travis J
Travis J

Reputation: 82297

How can I have one th for multiple tds?

I have n amount of tds inside of 1 tr. I would like to have a th at the top of the table which spans all n tds. Can this be done?

<table>
  <th>Header</th>
  <tr>
   <td> 1 / n </td><td> 2 / n </td><td >3 / n </td>...
  </tr>
</table>

Upvotes: 1

Views: 2012

Answers (3)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201768

If you want a header that appears very first in the table and spans all columns, the odds are that it’s not a header cell for all the columns but a caption for the entire table. In that case, the logical markup is to use the <caption>Header</caption>. It is written before any of the rows (and not wrapped inside a <tr> element). It will appear in normal text style by default, so you might want to set e.g. caption { font-weight: bold } in CSS.

Upvotes: 0

oqx
oqx

Reputation: 2377

there is a solution but it won't work on all browsers; colspan='0'

<table>
  <tr>
    <th colspan="0">Header</th>
  </tr>
  <tr>
   <td> 1 / n </td><td> 2 / n </td><td >3 / n </td>
  </tr>
</table>

This does NOT work when the table-layout CSS property is set to fixed, also this is not a good markup practice :P

Upvotes: 0

Oded
Oded

Reputation: 499182

You can use the colspan attribute as defined on table cells. Note that a th should be nested in a tr as well.

<table>
  <tr>
    <th colspan="n">Header</th>
  </tr>
  <tr>
   <td> 1 / n </td><td> 2 / n </td><td >3 / n </td>...
  </tr>
</table>

Upvotes: 2

Related Questions