Фрагмент из макета 320px.
Скрин
Пример в
Codepen сожмите до 320px
Отступы по краям - по 12px
Отступы между карточками/колонками в сумме 3px, при этом в мобильной версии у карточек нет отступов по краям экрана
Карточек может быть разное количество и по мимо карточек есть другие блоки которые не имеют отступов по краям.
Пример с двумя колонками - когда две колонки, то в принципе все ок, но что если их будет 3, например. Да, можно понаписать разные варианты в nth-of-type, но это выглядит костылем.
Пример с 3мя колонками - если обнулять крайние, то ширина их содержимого большие содержимого центральной, что логично. Но это нарушает дизайн. Возникает вопрос, как сохранить ширину и при этом обнулить края. Дописываешь к отрицательным отступам в row еще по 1.5px, но в таком случае появляется горизонтальный скролл.
Как правильно "обнулять" края в таких случаях?
Толи я туплю, толи дизайнер не понимает как нужно строить сетку.
Простой
Простой