Set the spacing between adjacent table cell borders.
Syntax
border-spacing: Length [VertLength] | inherit ;
Length - The border space measured in px, em or pt.
inherit - Inherit from the parent element.
This only applies to the separated borders model, if collapsing borders are used, Border Spacing will be ignored.
If two values are given, the first sets horizontal spacing, and the second vertical spacing.
Negative values are not allowed.
If border spacing is set to 0 the table cells will be pushed together, but two adjacent cells will still have two borders, unlike collapsed borders where all the borders around each cell (and the whole table) are collapsed into one.
This is equivalent to the old cellspacing property. Alternatively border-collapse: collapse; will remove all table cell border spacing.
Examples:
h1 { border-spacing: 5px; }
.emw3class { border-spacing: 2em 0.5em; }
#emw3id { border-spacing: 0px; }
Try it:
|
(CSS 2) Browser Support: All major browsers, IE 8.0+
“The Berlin Wall wasn't the only barrier to fall after the collapse of the Soviet Union and the end of the Cold War. Traditional barriers to the flow of money, trade, people and ideas also fell” ~ Fareed Zakaria
Related:
border-spacing - MDN Web Docs.
border - Shorthand to set all the border properties.
border-collapse - Collapse table borders.