HTML & CSS Wiki

READ MORE

HTML & CSS Wiki

The border-collapse property is used in CSS and certain HTML elements. It selects a table's border model. This has a big influence on the look and style of the table cells. The separated model is the traditional HTML table border model. Adjacent cells each have their own distinct borders. The distance between them given by the border-spacing property. In the collapsed border model, adjacent table cells share borders.


Values[]

  • separate - Default, uses the "separated borders" rendering model.
  • collapse - Uses the "collapsed borders" rendering model.


HTML example:

<table style="border-collapse:separate;">
<caption>Table</caption>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>1.1</td>
<td>2.2</td>
</tr>
</table>


CSS example:

table {
       border-collapse: separate;
}