How do I break html lists in columns, honoring alphabetical order in column direction?

what if I have a list like this:

<ul><li>a</li><li>b</li><li>c</li><li>d</li><li>e</li><li>f</li><li>g</li><li>h</li><li>i</li></ul>

And want a rendering like this:

a | e | ib | f |c | g |d | h |

I mean, broken into columns but honoring 'vertical' alphabetical order? Also, columns should be as 'tall' as the space available. So not fixed 4 rows like above. Nor fixed height container.

Is it possible? I know I can do it with flexbox but fixeng the container height. I took a look to grid specs too, but not sure if it's some way possible.

Any idea?