CSS - отображать элементы в столбцах

Question

Есть ли способ (может быть, flex, я не смог найти решение) для отображения, например, 5 элементов (A, B, C, D, E) в столбцах по вертикали с помощью CSS?вот так:

A  C  E
B  D

Я не хочу переупорядочивать элементы в html.

Answer 1

Из того, что я вижу:

1. столбцы: 3 решения - сортировка элементов в строках, а не столбцов
2. display: flex;flex-direction: столбец;решение довольно хорошее, но для него нужно установить высоту, поэтому в большинстве случаев его невозможно использовать

Единственное реальное решение, которое я нашел, это скрипт js, например: https://masonry.desandro.com/layout.html

Answer 2

Попробуйте это:

<div class="test">
    <Span>A</Span>
    <Span>B</Span>
    <Span>C</Span>
    <Span>D</Span>
    <Span>E</Span>
</div>

.test {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    height: 50px;
}