grid-template-columns

Flexbox & Grid

Defines track column setups, sizes, and layout patterns for 2D Grid layouts.

grid-template-columns: 100px 200px; Two static columns
grid-template-columns: 1fr 2fr; Relative fractional columns
grid-template-columns: repeat(3, 1fr); Three equal columns
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); Fluid responsive column grids

interactive-example.html

Live Preview