border-spacing

value: <length> <length> | inherit
initial value: 0
inherited: yes
percentages: N/A
applicable to: tables

The property of border-spacing is used to widen the space between cells of a table. The initial value is to have the cells of the table as separate with a distance of 0. If the border-collapse property is left at the default value as separate, and the border-spacing is left at the deault value of 0, there is an appearance of double thickness for the border of the inside cells as shown below:

 

       
       
       

The spacing between the cells of a table can be widened with the property of border-spacing.

The border-spacing can be an equal value in the horizontal and vertical direction when one value is entered, ot the horizontal and vertical direction can have different values.

Example:

table {border-spacing: 5px;}

       
       
       

Example:

table {border-spacing: 6px 2px;}