Grid поток элементов

Question

Как изменить поток элементов в грид, так чтобы заполнение шло не:

1  2
3  4
5  6

А было вот таким:

1  4
2  5
3  6

UPD: Можно использовать свойства и на дочерних элементах, но чтобы все было автоматизировано при добавлении конетнта.

ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
  <li>6</li>
</ul>

Answer 1

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

  ul {
      display: grid;
      grid-template-rows: 1fr 1fr 1fr;
      grid-auto-flow: column;
    }