There is some confusion regarding the different styling possibilities of a table, and which properties should be set on a table element and which on a cell (td) element. So let's clear this up.
The confusion is partly caused due to 2 deprecated html table attributes: cellspacing and cellpadding.
Let's look at the relevant ways to affect a table, and the ways to accomplish them (recommended and deprecated).
1. Control the padding inside each cell
The deprecated way has been to set the cellpadding attribute on the table.
The recommended way is to set the CSS padding property on the cell elements (td or th).
2. Control the space between the cell borders
The deprecated way has been to set the cellspacing attribute on the table.
The recommended way it to set the CSS property border-spacing on the table element.
3. Collapse the cell borders into a single border
This is done using the CSS property border-collapse on the table element.
Note: if you collapse the border, any border-spacing value will be ignored.
4. Set the style of the border of the cells
Style the border using CSS on the cells (td / th).
Addition note: you cannot set the margin on a table cell. It will be ignored. Use border-spacing on the table element instead.
Adam Porat is a team leader at Niloosoft on Hunter HRMS product.
