CSS border-spacing

The CSS border-spacing property allows you to specify the amount of space between borders of adjoining cells in tables. It can have an effect similar to HTML's cellspacing.

You can provide either one value or two. If you provide two values, the first value determines the horizontal spacing and the second determines the vertical spacing. If only one is provided, this value determines horizontal and vertical spacing.

Syntax:	border-spacing: <value>
Possible Values:	<length> (i.e. 2px) inherit
Initial Value:	0
Applies to:	'table' and 'inline-table' elements.
Inherited:	Yes
Media:	Visual
Example:	table.space {border-spacing:10pt}
Try it yourself!	<style type="text/css"> table.space { border: outset 5pt; border-spacing: 30pt 10pt; } td { border: inset 5pt; } </style> <table class="space"> <tr><td>This table is styled using the CSS border-spacing property. Note that two values were provided - one for horizontal border-spacing and one for vertical border-spacing. Try changing the value to see the effect it has on the border. The effect is similar to the HTML cellspacing property.</td></tr> <tr><td><b>Note:</b> If this is not working, it could be a browser compatibility issue - at the time of writing, browser support for the border-spacing property was limited . <p> border-spacing refers to the white space in between the table outset and the td inset.</p> </td></tr> </table>