Własność CSS grid-auto-flow

Własność CSS grid-auto-flow określa sposób rozmieszczenia jednostek siatki w wolnych miejscach układu CSS Grid przez algorytm automatycznego rozmieszczenia elementów.

Wartości i składnia

Własność grid-auto-flow jako wartość przyjmuje słowo kluczowe column lub row oraz ewentualnie słowo kluczowe dense jako dodatek po spacji do jednego z nich:

column

Elementy są umieszczane po kolei w kolumnach i w razie potrzeby tworzone są nowe kolumny.

row

Elementy są umieszczane po kolei w wierszach i w razie potrzeby tworzone są nowe wiersze.

dense

Przeglądarka stara się jak najdokładniej wypełnić luki w układzie. Jeśli mniejsze jednostki siatki znajdują się za większymi, to mogą „wpaść” w puste miejsca utworzone przez te większe jednostki, przez co ich kolejność widoczna na ekranie może być inna niż kolejność w kodzie, np.:

grid-auto-flow: row dense;

Podsumowanie