@Schamil74
Полный ноль -> Верстальщик -> Стремлюсь к фронт

Баг хрома или баг моей головы?

Столкнулся с такой задачей в хроме.
На скрине показано где найти проблему.
5a636c819df69452123402.png
Описание: зеленым типо кружками отмечены ячейки, которые должны быть без бордера.
В FF все нормально.
5a636e918d6d0536354124.png

https://jsfiddle.net/Schamil74/enyh41bu/
  • Вопрос задан
  • 157 просмотров
Решения вопроса 1
rockon404
@rockon404
Frontend Developer
Особенность сочетания border-collapse: collapse + colspan .
Ваш пример некорректно отображается еще в Opera и Safari.
Проблему можно решить следующими способами:
1. использованием box-sadow
2. использованием внутренней таблицы
3. использованием псевдоэлемента
Демо с примерами решения: https://jsfiddle.net/zek2uoL0/

Вариант с box-shadow не поддерживается IE11

Еще старайтесь !important вообще не использовать в верстке.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Odisseya
@Odisseya
WebDev
Решение. В HTML строка 171: уберите класс "border-bottom" у <td class="border-none border-bottom">& nbsp ;</td>, следующего за <td class="border-none text-left" colspan="3">Удостоверение №</td>, чтобы получилось:
<td class="border-none text-left" colspan="3">Удостоверение №</td>
<td class="border-none">&nbsp;</td>
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы