CSS: граница таблицы увеличена каждые 2-3 строки


Столкнулся с тем, что таблица с некоторой периодичностью рисует более толстые границы (сверху или снизу). Каждый вторая или третья строка таблицы имеет двойную границу:

Порыл через ‘inspect’ код css — не нашел лишних бордеров. В итоге, спустя плчаса выяснил, что это  проблема:

border-collapse: collapse;

Нужно поменять его на

border-collapse: separate;

При collapse граница между ячейками отображается одна и игнорируется cellspacing.

При separate — вокруг ячеек отображается своя собственная граница; в местах соприкосновения ячеек показываются сразу две линии.

В общем, благодаря collapse браузер может анализировать таблицу и убирать в ней двойные линии. Если у вас css трубочиста — скорее всего браузер напортачит, так что проще сидеть на separate.


Запись опубликована в рубрике HTML и CSS. Добавьте в закладки постоянную ссылку.

Добавить комментарий

🇬🇧 Attention! Comments with URLs/email are not allowed.
🇷🇺 Комментарии со ссылками/email удаляются автоматически.