Altering the order of things in a CSS grid from left-right to top-down

I am constructing an inventory of tags in a system, and people tags needs to be displayed in a CSS grid with three columns. So, one thing like this:

<ul>
    <li>Alfa</li>
    <li>Bravo</li>
    <li>Charlie</li>
    <li>Delta</li>
    <li>Echo</li>
    <li>Foxtrot</li>
</ul>

ul {
    show: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

When viewing this in a browser, the gadgets are ordered like this:

Alfa  Bravo Charlie
Delta Echo  Foxtrot

Nevertheless, i would really like them to be ordered like this:

Alfa  Charlie Echo
Bravo Delta   Foxtrot

So, principally ordered from high to backside as an alternative of left-right.

Is there any manner to do that in a easy manner? I already experimented a bit with :nth-child selectors and grid-column, however that does not actually do what i would like. I might in all probability clear up this with Javascript, however i wish to know if there is a CSS-only answer.