Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it valid to put h3 (or any heading) inside td tags?

The question is asked for TH tags, but I couldn't find one for TD tags.

Can I put headings inside <td> tags?

like image 215
jeff Avatar asked Oct 09 '13 10:10

jeff


2 Answers

thead is not h3, if you use h3 inside td element, it is absolutely fine, but if you use h3 as a direct child to tr is invalid.

Inorder to use thead you can use it like this

<table>
   <thead>
      <tr>
         <th>This is table head and not h3</th>
      </tr>
   </thead>
   <tfoot>
      <tr>
         <td>Foot Cell</td>
      </tr>
   </tfoot>
   <tbody>
       <tr>
          <td>
             <h3>It's completely valid to put your h3 here</h3>
             Table cell
             <p>You can also use p tag here
           </td>
       </tr>
   </tbody>
</table>

But if you do it something like this, is invalid

<table>
   <tr>
      <h3>It's invalid</h3>
      <td>This is a cell</td>
   </tr>
</table>

You can always check here whether your markup is valid or not.

like image 175
Mr. Alien Avatar answered Oct 05 '22 23:10

Mr. Alien


No elements can appear inside a tag. Inside a td element, i.e. between the <td> tag and the corresponding (possibly implicit) </td> tag, the content model is “flow content”. This effectively means anything that may appear inside the document body in general. So syntactically, h3 is allowed.

The content model of th is the same as that of td in HTML4, but in HTML5 CR, it is more limited and excludes heading elements, among other things.

The content model of the tr element (table row) allows only th and td children, so nothing else may appear directly inside it, only as wrapped in th or td.

These are the syntax rules and they do not imply that all content would be meaningful. In particular, a heading element inside th would be rather anomalous (what would it be a heading for? the th markup itself means a header cell), whereas in a td cell it could make perfect sense (e.g., in a table that compares two texts piecewise side by side).

like image 30
Jukka K. Korpela Avatar answered Oct 06 '22 00:10

Jukka K. Korpela