CSS Cellspacing

HTML used to have a cellspacing attribute for defining the space between cells on a table, but it has been phased out (as of HTML version 5).

And there never was a "CSS cellspacing" property.

But, although there isn't a "CSS cellspacing" property, there is a property that may be just what you're looking for.

CSS border-spacing Property

The CSS border-spacing property is kind of a CSS equivalent to the HTML cellspacing attribute of the <table> element. You can use this in conjunction with the CSS padding property to provide spacing and padding within your table cells.

The example table below has border-spacing applied to the table. Also, the table has a solid black border, while each cell within the table has a dotted orange border. These borders highlight the effect of the border-spacing property.

CodeResult

Table Cell 1 Table Cell 2
Table Cell 3 Table Cell 4

Note that, although the CSS padding property can be applied to any element, the border-spacing property only applies to tables and inline tables. Also, whereas the padding property can be applied against any side of an element, the border-spacing is applied to all sides of an element.

Check out CSS Cellpadding to see how to create padding within each table cell. Now that we've got the CSS border-spacing and padding properties, we'll never need to use HTML cellspacing and cellpadding again!

Enjoy this page?

  1. Link to this page (copy/paste into your own website or blog):
  2. Link to Quackit using one of these banner ads.

Thanks for supporting Quackit!

Sponsored Link: Design CODE-FREE Websites