CSS grid-auto-flow property
Browser support · legacy reference
ChromeFully supports
SafariFully supports
FirefoxFully supports
Internet ExplorerPartial support
EdgeFully supports
OperaFully supports
Description
CSS grid-auto-flow controls the placement of grid-items that were not placed by the grid-row or grid-column.
It allows the auto-placed items to get flowed into the unoccupied space. This unoccupied space may place the items in rows or columns depending upon the value of grid-auto-flow.
Syntax
grid-auto-flow : [row | column]
Property values
rowDefault
-
It automatically places an item in the row and finds the next row automatically to place an item in that row.
- Try it
grid-auto-flow: row; column
-
It automatically places an item in the column and finds the next column automatically to place an item in that row.
- Try it
grid-auto-flow: column;
Applicable to
It applies to grid containers.