border-collapse

Support Key: [CSS2|CSS2.1] [IE5|N7|O4|S1.2]
Other Table Properties
border-spacing
caption-side
empty-cells
speak-header
table-layout
= Index DOT Css by Brian Wilson =
  Main Index | Property Index | CSS Support History | Browser History  



   Quick Statistics   
Default Value:
   separate
Applicable Elements:
<table> or elements with an assigned 'display' value of "table" or "inline-table"
Inherit From Parent:
Yes
Applicable Media:
Visual
HTML Equivalent:
NA
Official Docs:
CSS2: Sect. 17.6, CSS2.1: Sect 17.6
Microsoft MSDN Reference
What is it?
The rendering of table borders is divided into two categories in CSS2 - "collapsed" and "separated". This property specifies which border rendering mode to use. In the collapsed border model, adjacent table cells share borders. In the separated model, adjacent cells each have their own distinct borders (the distance between them given by the 'border-spacing' property.)

In the CSS2 collapsed border model, provision is made for resolution of cases where borders specified for adjacent cells differ and are in conflict:
  1. If any shared border has a component where the 'border' is set to "hidden" for ANY of the sharing members, the common border should be unconditionally set to "hidden".
  2. If any shared border has a component where the 'border' is set to "none", it can be overridden by any other border-sharing member carrying a renderable 'border' property value. If ALL border-sharing members specify a value of "none" for a border component, only then will the border be set to "none".
  3. If a shared border has a 'border-width' contention, (with no component having a 'border' value of "hidden" of course...), the largest border-width should be rendered.
  4. If a shared border has a 'border-style' contention, the suggested priority should be used (decreasing from left to right): "double", "solid", "dashed", "dotted", "ridge", "outset", "groove", "inset."
  5. If a shared border has a 'border-color' contention, the suggested priority should be used (decreasing from left to right): Table cell, table row, row group, column, column group, table.

Allowed Values
inherit
[CSS2|CSS2.1] [N7|O7|S1.2]
Type: Explicit
Description:
Explicitly sets the value of this property to that of the parent.
collapse
[CSS2|CSS2.1] [IE5|N7|O4|S1.2]
Type: Explicit
Description:
Use the "collapsed borders" rendering model.
separate
[CSS2|CSS2.1] [IE5|N7|O4|S1.2]
Type: Explicit
Description:
Use the "separated borders" rendering model.
Example
Ext/Doc: table { border: medium double red;
border-collapse: separate; border-spacing: 10pt 5pt }
In-Line:  <table STYLE="border: medium double red;
border-collapse: separate; border-spacing: 10pt 5pt">
Notes Browser Peculiarities

Boring Copyright Stuff....