CSS2 » Properties » border-spacing

Version: Level 2

Compability: Currently not supported by any browser.

Syntax:
border-spacing : length length
length length
The length length values set the spacing. The second length is optional. If only the first length is used, then it sets the same value for both the vertical and horizontal spacing between adjacent cells. If both length length values are used, the first gives the horizontal spacing and the second the vertical spacing. No negative values are permitted. The values can be in any of the following seven units. Use the abbreviation.
 
centimeters
Length Abbrev.
cm
ems em
inches in
millimeters mm
picas pc
pixels px
points pt

The border-spacing property is used to set the vertical and horizontal spacing between adjacent cells in a table using the separate border model. This property is inherited.

In the separate model, the table has a separate outer border and each individual cell has its own separate internal border. The table outer border does not physically touch the individual internal cell borders.
 

Cell 1Cell 2
Cell 3Cell 4

Remember that a border is optional in a table and that the default is no border.
 
This is one of five Level 2 properties that specifically apply style to tables. The other four are border-collapse, caption-side, empty-cells, and table-layout.

Examples

Code:
<table style="border-collapse: separate; border-spacing: 10px">
<tr><td>Cell 1</td><td>Cell 2</td></tr>
<tr><td>Cell 3</td><td>Cell 4</td></tr>
</table>

Language(s): CSS2

See Also: