Есть следующая галерея:
песочница
У всех элементов галереи следующие стили:
.gallery__unit {
min-width: 283px;
display: flex;
position: relative;
justify-content: center;
padding: 5px;
flex: 1 0 calc(25% - 30px);
height: 325px;
overflow: hidden;
}
Если блок большой, то эму добавляется класс со стилями:
.large {
position: relative;
flex: 0 0 50%;
}
Сам контейнер-родитель:
.gallery {
display: flex;
flex-wrap: wrap;
max-width: 100%;
justify-content: space-between;
}
Как видно, у элементов галереи есть паддинги: padding: 5px;
Но я хочу сделать галерею на всю ширину экрана, без боковых отступов в 5px. Как это сделать?
Указать разным блокам разный padding-left и padding-right не получится, ибо flexbox (все прыгает и подстраивается под экран) Думал контейнеру-родителю указать отрицательные маржины, но тогда же все сдвигается вправо на 5px и появляются лишние отступы справа.