The grid-area Property

You can use the grid-area property to name grid items.

You can refer to the name when you set up the grid layout, by using the grid-template-areas property on the grid container.

This grid layout contains six columns and three rows:

Header
Menu
Main
Right
Footer

This page is optimized for screens less than 801px wide.