border-collapse property
[This documentation is preliminary and is subject to change.]
Sets or retrieves a value that indicates whether the row and cell borders of a table are joined in a single border or detached as in standard HTML.
![]() |
Syntax
border-collapse: collapse | separate
Property values
separate-
Default. Borders are detached (standard HTML).
collapse-
Borders are collapsed, where adjacent, into a single border.
CSS information
| Applies To | All elements |
|---|---|
| Media | visual |
| Inherited | no |
| Initial Value |
Standards information
Examples
This example demonstrates how to use the border-collapse attribute and the border-collapse 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
Build date: 3/14/2012
