border-collapse (CSS property)
| IE5.5+ | FF1+ | Saf1.3+ | Op9.2+ |
|---|---|---|---|
| Full | Full | Full | Full |
| Inherited | Initial | Version |
|---|---|---|
| Yes | separate |
CSS2, 2.1 |
Example
This style rule makes the table element
with the ID "results" use the collapsing borders
model:
#results {
border-collapse: collapse;
}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.
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
| IE | 5.5 | Full |
|---|---|---|
| 6.0 | Full | |
| 7.0 | Full | |
| Firefox | 1.0 | Full |
| 1.5 | Full | |
| 2.0 | Full | |
| Safari | 1.3 | Full |
| 2.0 | Full | |
| 3.0 | Full | |
| Opera | 9.2 | Full |
| 9.5 | Full |
Internet Explorer for Windows versions up to and
including 7 don’t support the value inherit.
Related Reading
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.
