HTML & CSS reference

border-collapse

Whether the borders of table cells are separate or merged into single lines.

Syntax

border-collapse: collapse;

Values

Parameter	Type	Description
separate	keyword	Each cell has its own border, with gaps between them (the default).
collapse	keyword	Neighboring borders merge into one line.

Examples

Double and merged borders:

<style>
  td { border: 1px solid gray; padding: 4px 8px; }
</style>
 
<table><tr><td>separate</td><td>$25</td></tr></table>
<br>
<table style="border-collapse: collapse;"><tr><td>collapse</td><td>$25</td></tr></table>

Notes

collapse is almost always what you want for data tables. With separate, the gap between cells is set by border-spacing.

Related recipes

In the tutorial

Styling lists and tables — Marker types and list-style, custom markers with ::marker, a menu from a list without bullets, and table borders, padding, alignment, zebra stripes and the caption.

Thanks for reading!