border-spacing (CSS property)

Spec
Inherited Initial Version
Yes CSS2
Browser support (more…)
IE8+ FF1+ SA1.3+ OP9.2+ CH2+
Full Full Full Full Full

Syntax

border-spacing: { length  [ length ] | inherit } ;

Description

This property sets the spacing between adjacent table cells’ borders using the separated borders model. If the collapsing borders model is used, this property is ignored.

Note that the distance between a cell border and the table border is the corresponding border spacing plus the table’s padding for that side.

See Table Formatting for details about the table border models.

The CSS2.1 specification states that user agents may apply this property to frameset elements (therefore replacing the framespacing attribute).

Example

This style rule sets 1em of horizontal spacing and 0.5em of vertical spacing between the cells of the table element with the ID "results":

#results {
  border-collapse: separate;
  border-spacing: 1em 0.5em;
}

Value

Negative values are not allowed.

The border spacing can be specified using one or two length values. If two values are given, the first sets the horizontal spacing, and the second sets the vertical spacing. If only one value is given, it sets both the horizontal and vertical spacing to the specified value.

Compatibility

Internet Explorer Firefox Safari Opera Chrome
5.5 6.0 7.0 8.0 1.0 1.5 2.0 3.0 3.5 1.3 2.0 3.1 4.0 9.2 9.5 10.0 2.0
None None None Full Full Full Full Full Full Full Full Full Full Full Full Full Full

Internet Explorer for Windows versions up to and including 7 do not support this property.

User-contributed notes

Related Products