Clever Geek Handbook

Could using the <th> tag after the <td> cause problems?

I came across a piece of html, I need to edit where the table looks like the code below. It feels a little messy and fiddles with the css I have to apply. Aside from being a bit oddly dominated by manipulation / style at home, are there cases where it's good practice?

<table>
    <tbody>
        <tr>
            <td> <a href="">edit</a> <a href="">new</a></td>
            <th>I AM THE IMPORTANT CELL</th>
            <td>things</td>
            <td>more things</td>
        </tr>
    </tbody>
</table>
+3


source to share


2 answers


The distinction between <th>

and <td>

is semantic. There are visual differences, but this is only the default user-to-user stylesheet and can be overridden. As part of the html specification, it specifically targeted headings <th>

, which can be headings for rows and columns. There was flexibility in how you use them. This does not cause any problems.

In fact, the example in the specification uses <th>

after <td>

.



  <tr> <td> <th scope=rowgroup> Cats <td> <td>

http://www.w3.org/TR/2014/REC-html5-20141028/tabular-data.html#the-th-element

+3


source


TH is assumed to be used as a header cell. If it's a header, then ideally, so there should be all the other columns as headers too, because you should ideally have a header row and then your data lines. However, this is perfectly valid HTML, but it does not use the correct elements for this purpose.



<table>
    <tbody>
        <tr>
            <th> <a href="">edit</a> <a href="">new</a></th>
            <th>I AM THE IMPORTANT CELL</th>
            <th>things</th>
            <th>more things</th>
        </tr>
        <tr> <!-- data cells--> </tr>
    </tbody>
</table>
-1


source






More articles:


All Articles