Windows apps
Collapse the table of content
Expand the table of content
Information
The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

border-collapse property

Indicates whether the row and cell borders of a table are joined in a single border or detached as in standard HTML.

CSS 2.1, Section 17.6

 

Syntax

border-collapse: collapse | separate | inherit

Property values

separate

Initial value. Borders are detached (standard HTML).

collapse

Borders are collapsed, where adjacent, into a single border.

inherit

The property takes the same specified value as the property for the element's parent.

CSS information

Applies Totable and inline-table elements
Mediavisual
Inheritedtrue
Initial Valueseparate

Standards information

Examples

This example demonstrates how to use the border-collapse CSS property and the borderCollapse scripting property to manipulate the border on a table.

Code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/borderCollapse.htm


<table id="oID_1" style="border-collapse: collapse">
  <tr>
    <td>EST</td>
    <td>9:00 a.m.</td>
  </tr>
  <tr>
    <td>CST</td>
    <td>8:00 a.m.</td>
  </tr>
  <tr>
    <td>PST</td>
    <td>6:00 a.m.</td>
  </tr>
</table>
<p>
  <input type="button" onclick="oID_1.style.borderCollapse='separate'" value="separate">
  <input type="button" onclick="oID_1.style.borderCollapse='collapse'" value="collapse">

See also

CSSStyleDeclaration
currentStyle
runtimeStyle
style
border

 

 

Show:
© 2017 Microsoft