CSS Almanac

Home » CSS Almanac » Properties » B » border-collapse

border-collapse

The border-collapse property is for use on <table> elements (or elements made to behave like a table through display: table or display: inline-table). There are two values:

  • separate (default) - in which all table cells have their own independent borders and there may be space between those cells as well.
  • collapse - in which both the space and the borders between table cells collapse so there is only one border and no space between cells.
table {
  border-collapse: separate; /* Or do nothing, this is default */
  border-spacing: 3px; /* Only works if border-collapse is separate */
}
separate
table {
  border-collapse: collapse; /* Or do nothing, this is default */
}
collapse

Browser Support

Chrome Safari Firefox Opera IE Android iOS
Works Works Works Works Works Works Works

Subscribe to The Thread

  1. You wrote:
    /* Or do nothing, this is default */ on both CSS examples
    Didn’t understand.

Speak, my friend

At this moment, you have an awesome opportunity* to be the person your mother always wanted you to be: kind, helpful, and smart. Do that, and we'll give you a big ol' gold star for the day (literally).

Posting tips:
  • You can use basic HTML
  • When posting code, please turn all
    < characters into &lt;
  • If the code is multi-line, use
    <pre><code></code></pre>
Thank you,
~ The Management ~