grid-template-columns
Defines the number and sizing of columns in a grid container.
49 effects in the catalog use this property.
Syntax
grid-template-columns: <track-list>;Watch out
`auto-fill` preserves empty tracks, while `auto-fit` collapses them and lets existing items expand. The difference is visible when the grid has fewer items than available slots.
Common values
repeat(3, 1fr)- Three equal columns
repeat(auto-fill, minmax(200px, 1fr))- Automatically chooses a column count from the available width
Effects using grid-template-columns
These are working effects from the catalog. Open a tile to inspect the full source.