lesha2008, извините, но я по-прежнему вижу картинки не тут в спойлере, а ссылками куда-то там.
И песочницы тоже не вижу.
Но ответить могу:
1. В современном мире для построения сеток используют флексы и гриды.
Флоаты используют только по назначению - для обтекания одного элемента другими или текстом.
В вашем макете никакого обтекания нет в помине.
2. Иконки являются украшениями, а не значимым контентом. В разметке они лишние. Такие штуки делают псевдоэлементами.
В разметке: список из 8 пунктов.
В каждом из которых заголовок и p.
Дальше гридом 2х2.
Псевдоэлемент располагается в первом столбце и двух рядах.
Антон Антон, угу, только зачем дивы в лейбл-то пихать? Новичок же не поймет, что это вы конструкцию показывали и скопирует прямо невалидный код и будет пользоваться.
Вот этого вполне достаточно: li>(input + label + p)
В крайнем случае ещё span внутри label на случай непредвиденных br.
Mors Clamor, либо были дочерние элементы по сценарию Сергея.
Либо вы дополнительно задавали дочерним элементам что-то типа height: 100%. А после этого они перестают растягиваться по stretch.
Хорошо, что вы сами понимаете о чем спрашиваете и знаете как этот бордер должен выглядеть. Нам же этого не видно.
Если нужен бордер на всю ширину окна, то нужно задать его блоку с шириной на всё окно. Благо точно есть body с такой шириной и можно ничего не придумывать.
Альтернатива: прибить абсолютом. В данном случае не ясно чего ради.
GaserV, так "сломайте" таблицу: задайте флекс или грид для tr и вперед.
Правда, ячейки перестанут вести себя как табличные, т.е. не будут знать о ширине аналогичных в другой строке.
И песочницы тоже не вижу.
Но ответить могу:
1. В современном мире для построения сеток используют флексы и гриды.
Флоаты используют только по назначению - для обтекания одного элемента другими или текстом.
В вашем макете никакого обтекания нет в помине.
2. Иконки являются украшениями, а не значимым контентом. В разметке они лишние. Такие штуки делают псевдоэлементами.
В разметке: список из 8 пунктов.
В каждом из которых заголовок и
p.Дальше гридом 2х2.
Псевдоэлемент располагается в первом столбце и двух рядах.