Как в CSS сделать, чтобы колонки colums сортировались построчно?

Question

[Иван]

Всем приветы! Есть некий блок, внутри него три колонки columns. Они сортируются по вертикали, тобишь так:
1 3 5
2 4 6

а надо сделать, чтобы это было по человечески, вот так:
1 2 3
4 5 6

Собственно вот код

#dle-content{column-count:3;column-gap:20px}
.sa {width:100%;height:auto;position:relative;margin-bottom:20px;break-inside:avoid;page-break-inside:avoid;break-inside:avoid-column}

<div id="dle-content">
<div class="sa"></div>
<div class="sa"></div>
<div class="sa"></div>
<div class="sa"></div>
<div class="sa"></div>
.................................
</div>

Может скрипт есть какой, чтобы это отсортировать?
Пожалуйста, не предлагайте использовать библиотеку masony, она мне не подходит.

Comments

[Сергей Горячев]

А может ты код покажешь какой-нибудь? По логике, второй вариант по умолчанию должен быть. Значит, у тебя именно сделано так.

[Ankhena]

masony, она мне не подходит.

Чем?
У нее есть куча аналогов.

[Иван]

Ankhena, например? я искал ничего не нашел

[Иван]

Сергей Горячев, показал, гляньти пожалуйста

[Ankhena]

Иван Анатоличь, Isotope хотя бы

Но вы не ответили

[Сергей Горячев]

Иван Анатоличь, а какую цель вообще преследовал ты (или не ты) создавая эту верстку? Просто если нахрен выбросить колонки и заменить на флекс, все заработает нормально.

[Сергей Горячев]

Иван Анатоличь, решить можно любую жопу https://jsfiddle.net/wcdjvzr2/ , но это не решение, а костыль, как говорил выше, лучше заменить css на флексы)

[Ankhena]

Сергей Горячев, ему же не ряды нужны.
А как масонри с горизонтальной нумерацией.
Только не понятно, почему не подходит сама масонри. Пока это загадка.

[Сергей Горячев]

Ankhena, а по моему ряды, ну, пусть разбирается)

[Ankhena]

Сергей Горячев, я имела в виду, что не ровные, а ступеньками.

Но да, пока больше добавить нечего.

[Иван]

Сергей Горячев, флекс тут не прокатит, так как у колонок разная высота.

[Иван]

Ankhena, масонри не подходит, потому что она блокам прописывает абсолютную позицию. В итоге некоторые блоки начинают залазить зруг на друга, а это ересь.

[Иван]

Сергей Горячев, нужны ряды, но чтобы выглядели как кирпичики. Почему? Потому что так красивее)

[Иван]

идеальным вариантом было бы просто отсортировать колонки

[Ankhena]

Иван Анатоличь,

масонри не подходит, потому что она блокам прописывает абсолютную позицию. В итоге некоторые блоки начинают залазить зруг на друга, а это ересь.

Что-то заставляет думать, что дело не в масонри.

Можете попробовать такой вариант
https://medium.com/@andybarefoot/a-masonry-style-l...

Answer 1

[Lord_Dantes]

Родителю всех элементов:

display: flex;
 flex-wrap: wrap;