Does each need an equal amount of s?

Question

Let's say I have

<tr>
   <td>Hi</td>
   <td>Hi</td>
   <td>Hi</td>
   <td>Hi</td>
   <td>Hi</td>
</tr>
<tr>
   <td>Bye</td>
   <td>Bye</td>
</tr>

without any colspan attributes. Both Chrome and Firefox will correctly render the two cells of the second row and then leave "3 TRs of empty space".

My question is: Is this actually syntactically allowed in HTML or something the browsers are merely "auto-fixing"?

Think `td` as cells rather than columns: After all, a `td` can span [multiple columns](https://stackoverflow.com/questions/3838488/html-table-different-number-of-columns-in-different-rows); so non-equal number of them are perfectly fine. — vahdet, Dec 12 '19 at 13:19
Does this answer your question? [Can HTML table have variable number of cells on rows?](https://stackoverflow.com/questions/3484768/can-html-table-have-variable-number-of-cells-on-rows) — symlink, Dec 12 '19 at 13:36

score 1 · Accepted Answer · answered Dec 12 '19 at 13:57

When creating an HTML table, you must have an equal number of headings and cells.

<table style="width:100%">
    <tr>
      <th>Firstname</th>
      <th>Lastname</th>
      <th>Age</th>
    </tr>
    <tr>
      <td>Jill</td>
      <td>Smith</td>
      <td>50</td>
    </tr>
    <tr>
      <td>Eve</td>
      <td>Jackson</td>
      <td>94</td>
    </tr>
</table>

Browsers always try to fix bad HTML when showing data to the user.

<table style="width:100%">
    <tr>
      <th>Firstname</th>
      <th>Lastname</th>
      <th>Age</th>
    </tr>
    <tr>
      <td>Jill</td>
      <td>Smith</td>
    </tr>
    <tr>
      <td>Eve</td>
      <td>94</td>
    </tr>
</table>

This would show correctly to the user, but it is invalid HTML code.

To make sure your HTML is completely correct, try XHTML.

What is XHTML?

XHTML stands for EXtensible HyperText Markup Language
XHTML is almost identical to HTML
XHTML is stricter than HTML
XHTML is HTML defined as an XML application
XHTML is supported by all major browsers

Here is a bad example of XHTML:

<html>
<head>
  <title>This is bad HTML</title>

<body>
  <h1>Bad HTML
  <p>This is a paragraph
</body>

Here is a good version of XHTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title>Title of document</title>
</head>

<body>
  some content
</body>

</html>

You can validate your code at an XHTML Validator like this one.

For more information of tables and how they work, check out the W3 page of tables.

W3Schools Tables W3Schools XHTML

score 0 · Answer 2 · answered Dec 12 '19 at 13:35

Technically this is not valid html. If you run this through an html validator, e.g.

https://validator.w3.org/

You will get this error:

A table row was 2 columns wide, which is less than the column count established by the first row (5).

<table>
  <tr>
    <td>Hi</td>
    <td>Hi</td>
    <td>Hi</td>
    <td>Hi</td>
    <td>Hi</td>
  </tr>
  <tr>
    <td>Bye</td>
    <td>Bye</td>
  </tr>
</table>

All modern browsers will render this correctly, but if you want to have valid html, use colspan to balance out the rows:

<table>
  <tr>
    <td>Hi</td>
    <td>Hi</td>
    <td>Hi</td>
    <td>Hi</td>
    <td>Hi</td>
  </tr>
  <tr>
    <td>Bye</td>
    <td colspan="4">Bye</td>
  </tr>
</table>

Hmm, it's not an error though but a "warning"... if possible, I'd want to leave it as-is (it's auto-generated content that might end for example with 5 tds in the first but 1 in the 2nd row), but if it's actually incorrect html, I'll fix it. Is there a definite word somewhere in the spec? — MiK, Dec 12 '19 at 13:52

Does each need an equal amount of s?

2 Answers2