Must a table cell always have content?

Should you insert a space or a graphic at least?

[kapow]

I have heard empty table cells should not be left completely empty i.e. they must have at least a space or a spacer-graphic. Is this true? Can anyone point me to the an authoritive source that says so?

[Quadrille]

I don't think it's so much a 'rule' as a way of helping the page to look the same in all browsers.

But others may well know better ...

[bcolflesh]

Quadrille is correct - no rule, just the fact that some browsers collapse the cell if it doesn't have any content - I use   typically.

[rocknbil]

You **should** put something in there but it's not required. Copy and paste this entire post in a doc and look at it in IE:

<table border="1">
<tr><td>some content</td><td style="background-color: #c0c0c0"></td><td></td></tr>
<tr><td></td><td style="background-color: #c0c0c0"></td><td>below is no content</td></tr>
<tr><td></td><td style="background-color: #c0c0c0"></td><td></td></tr>
</table>

Then with &nbsp;, but note the height of the last row:

<table border="1">
<tr><td>some content</td><td style="background-color: #c0c0c0">&nbsp;</td><td>&nbsp;</td></tr>
<tr><td>&nbsp;</td><td style="background-color: #c0c0c0">&nbsp;</td><td>below is no content</td></tr>
<tr><td>&nbsp;</td><td style="background-color: #c0c0c0">&nbsp;</td><td>&nbsp;</td></tr>
</table>

You will find some unrendered cells without something in the cells, and will see missing background colors. In the last example, the vertical spacing in the cells will vary with the font size used on the page. This is where the damnable spacer made it's debut. By putting a 1X1 pixel spacer in the cells and sizing it as required, it would "lock in" the size of the cells, as long as the cellpadding and cellspacing are set to 0:

<table border="1" cellpadding="0" cellspacing="0"> 
 <tr> 
 <td>some content</td> 
 <td style="background-color: #c0c0c0"><img src="spacer.gif" width="23" height="1" alt=""></td> 
 <td><img src="1x1_spacer.gif" width="23" height="1" alt=""></td> 
 </tr> 
 <tr> 
 <td><img src="1x1_spacer.gif" width="23" height="1" alt=""></td> 
 <td style="background-color: #c0c0c0"><img src="1x1_spacer.gif" width="23" height="1" alt=""></td> 
 <td>below is no content</td> 
 </tr> 
 <tr> 
 <td><img src="1x1_spacer.gif" width="23" height="1" alt=""></td> 
 <td style="background-color: #c0c0c0"><img src="1x1_spacer.gif" width="23" height="1" alt=""></td> 
 <td><img src="1x1_spacer.gif" width="23" height="1" alt=""></td> 
 </tr> 
</table> 

So if you're using tables, it's a good idea to put *something* in empty cells. But if the table is used for layout, you shouldn't be using tables. :-)

[kapow]

I don't think it's so much a 'rule' as a way of helping the page to look the same in all browsers

This is exactly what I thought. I am having an argument with an overseas outsource company we use. Their code is good but not perfect, which I accept because most of the code I see from others is very bad. I am gradually educating them about the quality of code we want, and they are getting better and better.
Just recently we spotted several empty table cells in a page template they are working on. When I said 'please don't allow empty table cells', they replied with something like 'why not, there is nothing wrong with it...' - and the discussion has continued.
As far as I can tell there is no html authority that says 'do not allow empty table cells...'. If I could direct my coder to such a link it would finish this irritating debate.

But if the table is used for layout, you shouldn't be using tables.

"shouldn't"! - Its a resource issue. Html coders that use tables are easyer to find and less expensive. We have some sites in pure css layout, I have had cases in the past where we need the html coders to fix something and the reply is somthing like "Sorry the css expert is busy on other projects - or is off sick...". - while there are many of the more basic coders who use tables, are available to work on a site, and are inexpensive. I require that any of our sites should be editable by any of our employees and outsource companies (otherwise stuff doesn't get done).

So until the average html coder can do pure css, we use tables (in order to stay in business).

Does anyone know if a highly respected site about html (w3c, government, etc) with a reference to not having empty table cells?

[phranque]

given that the empty-cells property for table cells [w3.org] is supported by css, i think that indicates an acceptance of the practice.

[kapow]

...the empty-cells property for table cells is supported by css

Wow! thats interesting. So that means problems with empty cells not rendering are due to browsers not conforming to standards?

I would still rather not allow empty table cells because of the problems. But it looks like I can't say 'its official'. I have to say 'its my personal preference'.

[phranque]

Wow! thats interesting. So that means problems with empty cells not rendering are due to browsers not conforming to standards?

not necessarily.
i'm not sure there is a standard for rendering empty cells.
however you can probably enforce your preferred standard behavior in css-compliant browsers by specifying it in your stylesheet.

[Quadrille]

Tragically, using css brings exactly the same problem as an empty table cell; not every browser will display the page in the same way.

There's certainly a valid argument that you 'should' use css - and many of us would love to - but there's an equally valid response "I'll wait until the 'official' code looks the same in all common browsers, thanks."

That day will surely come; but it is a problem for the browser-makes and the code folk; it is not a 'rule' - yet - and so people are perfectly entitled to use tables for layout until they get their act together.

[phranque]

Tragically, using css brings exactly the same problem as an empty table cell;

not arguing the truth of your statement, but i was actually talking about using css AND tables - that is, specifying a style for a <TD> tag when the cell is empty of contents.

[tim222]

I would still rather not allow empty table cells because of the problems. But it looks like I can't say 'its official'. I have to say 'its my personal preference'.

You could simply tell them it looks sloppy, because the empty cells are inconsistent.

I have no idea why they would argue about this. It would be faster to just fix it. A professional wouldn't think of delivering something like that.

[Drag_Racer]

According to W3C specs for html4.01, header cells (TH) and data cells (TD) may be empty.

Cells may be empty (i.e., contain no data).

though, they give no specification on how the user agent must render the cell.

Myself, I add a non-breaking spacer and assign a class of 'empty' to the cell. this way I can control the way it is rendered, IE: padding, line-height, font-size, etc.

[phranque]

i would suggest that you tie the deliverables to performance rather than worry about such details as empty table cells.
if you can demonstrate that empty table cells cause problems due to inconsistent browser rendering (or whatever), then make cross-browser rendering compatibility (or whatever) the issue.
then create a css or javascript that will help you identify empty cells so that you can look for the problems when testing.
if you can't identify a performance issue - what's your problem?
if you can find a problem, let them fix it and suggest they fix it by filling or removing the empty cell.