For whatever reason, I have been unable to get any table cells to have margin between them. I want the table cells to have a grey background colour (over a white page background) so it looks like tiles with white between them.

I tried in the HTML,

<table cellspacing="3">

Also in the CSS,

table td {
margin:3px;
}

Nothing works. The cells are still stuck together, like one big grey blob. Am I missing something very very basic here?

6 Answers
6

"The values for border-spacing are two length measurements. The horizontal
value comes first and applies between columns. The second measurement is
applied between rows. If you provide one value, it will be used both horizontally
and vertically. The default setting is 0, causing the borders to double up
on the inside grid of the table."

I think cellspacing takes the color same as the table's background color.
So you have two options:
1. Apply the background color to the tds rather than the <table> itself.
2. You might want to use a white border (border for <td> with a border-collapse: collapse for the table)

Try adding a td between the two TDs you want to have the margin. Set it to have no background (just don't put "background:something;") and to have the width you want. If you want to put a margin between two TRs, just add another tr between them and put a td with the height you want the margin to have. You can even use the same class for the TDs and set the CSS only once.