Даже не заменить.. justify-content распределяет элементы неравномерно. Вот похожий вопрос - Как разместить два последних элемента слева при justify-content: space-between. Сверстал сайт, потерял scss и теперь перевести в grid будет сложно. Какие есть варианты кроме маржинов? а если и они, то margin-left: -33% использовать? А если элементов будет не 8, как в примере, а 9, js? От костылей к костылям...
Изменено: Всё нормально, scss найден:) Но всё же, как это делают другие сайты без гридов?
jsfiddle - https://jsfiddle.net/pgh9j71a/17/
.container {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
max-width: 600px;
margin: 0 auto;
}
.item {
background-color: green;
width: 100px;
height: 40px;
margin: 5px;
color: #fff;
text-align: center;
font-size: 30px;
padding: 40px;
}
<div class="container">
<div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
<div class="item">5</div>
<div class="item">6</div>
<div class="item">7</div>
<div class="item">8</div>
</div>