grid-template-columns
Defines the number and widths of columns in a grid. You can set fixed sizes, percentages, or use the 'fr' unit to fill available space.
It is documented as part of the CSS Grid Layout specification.
Syntax
/* Usage Example */
.container {
display: grid;
grid-template-columns: 200px 1fr 1fr;
/* one fixed column, two flexible ones */
}
/* Syntax */
grid-template-columns: none;
grid-template-columns: subgrid;
/* Global values */
grid-template-columns: inherit;
grid-template-columns: initial;
grid-template-columns: revert;
grid-template-columns: revert-layer;
grid-template-columns: unset;
grid-template-columns Browser support
Widely available
Since
2017 95% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2017.
57+
52+
10.1+
16+