Мне нужно создать автоматическую ширину css сетку с разрывом на новую строку после каждого 8 элемента.
Я не могу изменить html разметку и использовать flex css собственность. Сделайте это с css свойство сетки.
Я не могу сделать обратный для второго ряда, так что он начинается с узкой карты, как в дизайне.
.block-instagram {
display: grid;
grid-template-rows: repeat(2, 225px);
grid-template-columns: repeat(4, 368px 225px);
grid-gap: 2px;
}
.block-instagram__item {
background: #e3e3e3;
}
<div class="block-instagram">
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
<div class="block-instagram__item"></div>
</div>