CSS border-spacing Property


Example

Set the border-spacing for a table:

table {
    border-collapse: separate;
    border-spacing: 10px 50px;
}

Try it yourself »

Definition and Usage

The border-spacing property sets the distance between the borders of adjacent cells (only for the "separated borders" model).

Default value: 0
Inherited: yes
Animatable: yes. Read about animatable Try it
Version: CSS2
JavaScript syntax: object.style.borderSpacing="15px" Try it


Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
border-spacing 1.0 8.0 1.0 1.0 4.0

Note: IE8 supports the border-spacing property only if a !DOCTYPE is specified.


CSS Syntax

border-spacing: length|initial|inherit;

Property Values

Value Description Play it
length length Specifies the distance between the borders of adjacent cells in px, cm, etc. Negative values are not allowed
  • If one length value is specified, it specifies both the horizontal and vertical spacing
  • If two length values are specified, the first sets the horizontal spacing and the second sets the vertical spacing
Play it »
initial Sets this property to its default value. Read about initial Play it »
inherit Inherits this property from its parent element. Read about inherit


Related Pages

CSS tutorial: CSS Table

HTML DOM reference: borderSpacing property



Color Picker

colorpicker