CSS grid-auto-flow Свойство

Вставка столбцов с автоматически размещаемыми элементами:

.grid-container {
display: grid;
grid-auto-flow: column;
}

Определение и использование

Свойство grid-auto-flow управляет тем, как автоматически размещаемые элементы вставляются в сетку.

Примечание: Добавьте значение "плотный", чтобы заполнить все отверстия в сетке.

Значение по умолчанию:	row
Inherited:	no
Animatable:	yes. Читайте о animatable
Version:	Модуль макета сетки CSS уровень 1
Синтаксис JavaScript:	object.style.gridAutoFlow="row dense"

Номера в таблице указывают первую версию браузера, которая полностью поддерживает свойство.

Свойство
grid-auto-flow	57	16	52	10	44

grid-auto-flow: row|columns|row dense|column dense;

Значение	Описание
row	Значение по умолчанию. Вставка автоматически размещаемых элементов путем заполнения каждой строки
column	Вставка автоматически размещаемых элементов путем заполнения каждого столбца
row dense	Вставка автоматически размещаемых элементов путем заполнения каждой строки и заполнения всех отверстий в сетке
column dense	Вставка автоматически размещаемых элементов путем заполнения каждого столбца и заполнения всех отверстий в сетке

Заполните все отверстия в сетке, добавив "плотный" значение:

.grid-container {
display: grid;
grid-auto-flow: row dense;
}