| Inherited | Initial | Version |
|---|---|---|
| Yes | separate |
CSS2, 2.1 |
| IE5.5+ | FF1+ | SA1.3+ | OP9.2+ |
|---|---|---|---|
| Full | Full | Full | Full |
Syntax
Description
This property specifies the
border model that’s to be used for a table or an inline table—that is, an
element whose display property has one of the values
table or inline-table.
See Table Formatting for details about the table border models.
Example
This style rule makes the table element
with the ID "results" use the collapsing borders
model:
#results {
border-collapse: collapse;
}Value
collapse- selects the collapsing borders model (the
border-spacingandempty-cellsproperties will be ignored) separate- selects the separated borders model (the
border-spacingandempty-cellsproperties will be taken into account)
Note that the initial value was collapse in
CSS2, but it was changed to separate in
CSS2.1.
Compatibility
| Internet Explorer | Firefox | Safari | Opera | |||||||
|---|---|---|---|---|---|---|---|---|---|---|
| 5.5 | 6.0 | 7.0 | 1.0 | 1.5 | 2.0 | 1.3 | 2.0 | 3.0 | 9.2 | 9.5 |
| Full | Full | Full | Full | Full | Full | Full | Full | Full | Full | Full |
Internet Explorer for Windows versions up to and
including 7 don’t support the value inherit.
User-contributed notes
- ID:
- #1
- Date:
- Wed, 27 Feb 2008 07:05:53 GMT
- Status:
- This note has not yet been confirmed for accuracy and relevance.
Firefoxes handling of collapse appears to be buggy...
When you collapse borders within a table, the displayed border will come out looking like the margin-top and margin-left were set to 1 less than they should be. While not a big deal it's rather off-putting when it doesn't align flush properly with other elements...
Add a note
To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.