border-collapseСвойство для использования на
display: table display: inline-table
separate(по умолчанию) - в котором все ячейки таблицы имеют свои собственные независимые границы, и между этими ячейками также может быть пространство.collapse- в котором и пространство, и границы между ячейками таблицы сжимаются, поэтому остается только одна граница и нет места между ячейками.
Когда border-collapseесть collapse, примечательно, что такие свойства, как border-spacingand border-radius(на фактических границах) ничего не делают. Вам понадобится, border-collapse: separate;если вам понадобится одна из этих вещей.
Вот пример, где вы можете переключаться между ними:
См.
Таблицу Pen Table с закругленными ячейками Криса Койера (@chriscoyier)
на CodePen.
Поддержка браузера
элементы (или элементы, которые ведут себя как таблица через или). Есть два значения:| Хром | Сафари | Fire Fox | Опера | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Работает | Работает | Работает | Работает | Работает | Работает | Работает |