Пропадает border-collapse: collapse при float:left/right, как избежать?

Question

[Денис Букреев]

codepen.io/anon/pen/wMzvLJ - вот поциент с данным диагнозом.

С float влияние border-collapse пропадает, а если убрать float, то границы схлопываются и все нормально - что за борода еще такая? Как это можно объяснить и как вылечить поциента?

Спасибо

Answer 1

[Владислав Самойленко]

Обтекание по левому краю - это свойство не для table-cell. Float-left элемент - строчный а не табличный.
Верстайте как в макете, css'ом можно все настроить.

Comments

[Mr Crabbz]

Поправочка: Float-left элемент - блочный.

[Денис Букреев]

Как же тогда сверстать?
При указании любых свойств границы (outline, border, box-shadow) - она при float будет двойная

[Владислав Самойленко]

Вариант очень не элегантный, но рабочий для этого случая.
codepen.io/anon/pen/PZGGgE

[Денис Букреев]

Владислав Самойленко: тогда, если будет меньшее количество объектов - все границы поломаются)
придется применять row