grid-area
Last Updated: May 1, 2022
Definition
The grid-area property is used to define the size, and location of the grid layout. This is the shorthand representation of the following properties
grid-area syntax
grid-area: grid-row-start / grid-column-start / grid-row-end / grid-column-end | itemname;Example
Item1 will start from the 1st column of the 1st row and it will span two units along both directions
item1{
grid-area: 1 /1 /span 2/ span 2;
}1
2
3
4
5
6
7
8
9