crear una cuadrícula con 2 columnas y un número automático de filas en función del número de elementos de la lista

¡Esto de CSS Grid es difícil! Estoy tratando de crear un diseño básico de cuadrícula de 2 columnas a partir de mi lista de elementos. Debería decidir automáticamente el número de filas en función del número de elementos de la lista. Lo tengo funcionando y luciendo bien, excepto que primero llena la fila y luego baja a la siguiente fila. Quiero que primero llene toda la columna y luego vaya a la siguiente columna. Así que pensé que podría agregar grid-auto-flow: column;a mi ul. Pero por alguna razón eso lo convierte en una sola fila.

Aquí está el CSS que tengo actualmente:

ul.dept-list{display:grid;grid-template-columns:repeat(2,minmax(200px,1fr));}

Intenté usar columnas css3. Así es como se ve al agregar columns: 2; -webkit-columns: 2; -moz-columns: 2;al ul.

Y así es como se ve con mi código de cuadrícula:

ACTUALIZACIÓN: Resulta que tenía esos elementos de la lista flotando a la izquierda de algún otro CSS. Conseguí que funcionara con columnas CSS después de todo. Todavía desearía que alguien pudiera decirme cómo hacerlo con grid.

Aquí está mi código CSS final que usé para que se vea bien

ul.dept-list{columns:2;-webkit-columns:2;-moz-columns:2;height:auto;}

ul.dept-list li{display:block;width:250px;float:none;}

ul.dept-list li a.dropdown-item{padding:.25rem .5rem;}