Как сделать корректную перестановку элементов?

Question

[nen0y]

Как сделать корректную перестановку элементов?
Если я использую justify-content: space-between, то результат не удовлетворяет мои нужды.
Подскажите, как сделать правильно?

https://codepen.io/5dc8b3/pen/dyMBwqX

Answer 1

[Никита Михайлов]

Что вы имеете в виду под корректной перестановкой? Перенос? И чем justify-content не подошёл? В вашем примере можно сделать так:

.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 160px;
  .item {
    border-radius: 10px;
    width: 50px;
    height: 50px;
    margin-bottom: 5px;
    display: block;
    background: #ffcfa6;
  }
}

Comments

[nen0y]

хотел бы что-бы элементы по одному перескакивали на следующую строку, с уменьшением контейнера