Grid template rows

Sets a grid's rows and their heights.

What does grid-template-rows do?

grid-template-rows sets the rows of a grid and how tall each one is.

.page { display: grid; grid-template-rows: 60px 1fr 40px; }   /* header, content, footer */

Level: Journeyman · More CSS terms at this level

Updated September 27, 2026