grid-template-areas
grid-template-areas is a CSS property in the Grid category. Grid layout properties for two-dimensional page layouts. The syntax is grid-template-areas: none | <string>+. A typical example: grid-template-areas: "header header" "sidebar main" "footer footer"; It is commonly applied to markup such as <div class="demo">Sample</div> Browser support: Chrome 57+, Firefox 52+, Safari 10.1+, Edge 16+. A close relative is display: grid, which grid layout properties for two-dimensional page layouts. A close relative is grid-template-columns, which grid layout properties for two-dimensional page layouts. A close relative is grid-template-rows, which grid layout properties for two-dimensional page layouts. More about this category: CSS Grid properties for two-dimensional layouts and grid areas. Related Grid entries: display: grid, grid-template-columns, grid-template-rows, grid-column, grid-row, grid-template, grid-auto-flow, grid-auto-columns. This page is part of the free CSS Reference documentation covering 841+ properties, selectors, functions, and at-rules, each with syntax, values, examples, and browser support.