mozilla

Revision 20805 of border-spacing

  • Revision slug: CSS/border-spacing
  • Revision title: border-spacing
  • Revision id: 20805
  • Created:
  • Creator: Mgjbot
  • Is current revision? No
  • Comment robot Removing: [[pl:Dokumentacja CSS:Własności szablonu]]

Revision Content

{{template.CSSRef()}}

Summary

The border-spacing property specifies the distance between the borders of adjacent cells (only for the separated borders model). This is equivalent to the cellspacing attribute in presentational HTML.

  • Initial value: 0
  • Applies to: tables and inline-tables
  • Inherited: Yes
  • Media: Visual
  • Computed Value: two absolute lengths

Syntax

border-spacing: <length> | <length> <length> | inherit

Values

  • <length> : A length to be used for both horizontal and vertical border spacing.
  • <length> <length> : The first length gives the horizontal spacing (space between cells in adjacent columns) and the second length gives the vertical spacing (space between cells in adjacent rows).

Examples

{{template.CSSRefExampleLink("border-spacing")}}

table#space {
  border-collapse: separate;
  border-spacing: 10px 5px;
}

Notes

This property applies only when {{template.Cssxref("border-collapse")}} is "separate".

The border-spacing is also used along the outside edge of the table, where the distance between the table's border and the cells in the first/last column or row is the sum of the relevant (horizontal or vertical) border-spacing and the relevant (top, right, bottom, or left) padding on the table.

Specifications

Browser compatibility

Browser Lowest Version
Netscape 6
Internet Explorer 7
Firefox 1
Mozilla 1
Safari 1
Opera 6


See also

{{template.Cssxref("border-collapse")}}

Revision Source

<p> 
{{template.CSSRef()}}
</p>
<h3 name="Summary"> Summary </h3>
<p>The border-spacing property specifies the distance between the borders of adjacent cells (only for the <a href="en/CSS/border-collapse">separated borders model</a>).  This is equivalent to the cellspacing attribute in presentational HTML.
</p>
<ul><li> Initial value: 0
</li><li> Applies to: tables and inline-tables	
</li><li> Inherited: Yes
</li><li> Media: <a href="en/CSS/Media/Visual">Visual</a>
</li><li> Computed Value: two absolute lengths
</li></ul>
<h3 name="Syntax"> Syntax </h3>
<p>border-spacing: &lt;length&gt; | &lt;length&gt; &lt;length&gt; | inherit
</p>
<h3 name="Values"> Values </h3>
<ul><li> <b>&lt;length&gt;</b> : A length to be used for both horizontal and vertical border spacing.
</li><li> <b>&lt;length&gt; &lt;length&gt;</b> :  The first length gives the horizontal spacing (space between cells in adjacent columns) and the second length gives the vertical spacing (space between cells in adjacent rows).
</li></ul>
<h3 name="Examples"> Examples </h3>
<p>{{template.CSSRefExampleLink("border-spacing")}}
</p>
<pre>table#space {
  border-collapse: separate;
  border-spacing: 10px 5px;
}
</pre>
<h3 name="Notes"> Notes </h3>
<p>This property applies only when {{template.Cssxref("border-collapse")}} is "separate".
</p><p>The border-spacing is also used along the outside edge of the table, where the distance between the table's border and the cells in the first/last column or row is the sum of the relevant (horizontal or vertical) border-spacing and the relevant (top, right, bottom, or left) padding on the table.
</p>
<h3 name="Specifications"> Specifications </h3>
<ul><li>  <a class="external" href="http://www.w3.org/TR/CSS21/tables.html#propdef-border-spacing">CSS 2.1</a>
</li></ul>
<h3 name="Browser_compatibility"> Browser compatibility </h3>
<table class="standard-table">
  <tbody><tr>
    <th>Browser</th>
    <th>Lowest Version</th>
  </tr>
  <tr>
    <td>Netscape</td>
    <td>6</td>
  </tr>
  <tr>
    <td>Internet Explorer</td>
    <td>7</td>
  </tr>
  <tr>
    <td>Firefox</td>
    <td>1</td>
  </tr>
  <tr>
    <td>Mozilla</td>
    <td>1</td>
  </tr>
  <tr>
    <td>Safari</td>
    <td>1</td>
  </tr>
  <tr>
    <td>Opera</td>
    <td>6</td>
  </tr>
</tbody></table>
<p><br>
</p>
<h3 name="See_also"> See also </h3>
<p>{{template.Cssxref("border-collapse")}}
</p>
Revert to this revision