DevGuru CSS2: border-spacing

Quick References

Features

Partners

PROPERTY: border-spacing

border-spacing : length length

Compatibility: Currently not supported by any browser
Version: Level 2
Inherited: Yes

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

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 1	Cell 2
Cell 3	Cell 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.

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.

Length	Abbrev.
centimeters	cm
ems	em
inches	in
millimeters	mm
picas	pc
pixels	px
points	pt

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>