The grid item’s position: grid-row-start and grid-row-end

Great job! But what if we want to stretch a cell across rows as well?

We can use the grid-row-end property to do this. It works in conjunction with grid-row-start and assigns the coordinates we want to the cell.

In the example above, the cell starts on row line 2 and ends on row line 4.

The code looks like the following:

grid-row-start: 2 means that the element starts on row line 2.
grid-row-end: 4 means that the element ends on the 4th row line.

Now let’s try to lay out our grid item so that it stretches across two rows and two columns at the same time.