grid-template-areas

The grid-template-areas CSS property specifies named grid areas, establishing the cells in the grid and assigning them names.

Example

Initial value none
Applies to grid containers

Syntax

  
grid-template-areas: "a a b" "a a b" "c c b";
  

Values

The grid container doesn’t define any named grid areas.
A row is created for every separate string listed, and a column is created for each cell in the string. Multiple named cell tokens within and between rows create a single named grid area that spans the corresponding grid cells. Unless those cells form a rectangle, the declaration is invalid.

Browser support

grid-template-areas5716524410.1

We use cookies to improve your experience. Learn more in our Privacy policy.

×