# Grid template columns

Sets a grid's columns and their widths.

## What does `grid-template-columns` do?

`grid-template-columns` sets how many columns a grid has and how wide each one is.

```css
.products { display: grid; grid-template-columns: 1fr 1fr 1fr; }   /* three equal columns */
```

Level: Journeyman · [More CSS terms at this level](https://www.ask-codey.com/glossary/subjects/css/journeyman)

Updated: September 27, 2026

Source: https://www.ask-codey.com/glossary/grid-template-columns