html table syntax validation

Question

This should be an easy one.

I have a table like so:

<table>
<tr>
<td></td><td></td><td></td><td></td>
</tr>
<tr>
<td></td>
</tr>
</table>

My firefox 3 validator says this is acceptable code. It just seems wrong to me, are there any possible issues leaving the table rows uneven like this? It works in IE7 too.

Answer 1

If you want to use uneven amounts of rows/columns, you need to should use rowspan and/or colspan attributes to indicate this. eg:

<table>
<tr><td></td><td></td><td></td></tr>
<tr><td colspan="3"></td></tr>
</table>

As guffa corrected me below, colspan isn't technically needed, but it never hurts to be explicit about your intent.

Answer 2

You should use 'rowspan' or 'colspan' attributes

<table>
  <tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td colspan="3"></td>
  </tr>
</table>

Answer 3

Well, there are no syntax errors there, and I really can't see why you should be sceptical about a table like that, as long as you use the colspan attribute of the td-element:

<table>
<tr>
<td></td><td></td><td></td><td></td>
</tr>
<tr>
<td colspan="3"></td>
</tr>
</table>

Hope that helped.

Answer 4

That code is fine from a structural point of view. It's valid XHTML. Compare this:

<orders>
   <order id='2009/1'>
     <item id='1'/><item id='2'><item id='3'/>
   </order>
   <order id='2009/2'>
     <item id='33'/>
   </order>
</orders>

It might look strange though, hence the suggestion to use colspan. That way you can get the single TD to fill up the row, instead of being the width of the TD above it.

Answer 5

Table rows are not required to have the same number of cells. The number of columns in the table is determined from the row with most cells.

Your second table row will just have three cells that are blank (which is not the same as empty cells).