The value would be the column line number. In this case, it's 2. Let's see what we have now. Yes, the message block is on the right, but it's not at the top. So it's not starting from row line 1. To do that, let's use the gridRowStart property. And the value here would be 1. We have the message block in place now, but it's not yet spanning across two rows, which is why the email block is down here. It does appear like there's a lot of empty space here, but no. If you inspect, this is still row number 1 and email address will not come into row number 1, right? But if we make the message block span across the first two rows, the problem is solved. We can do that using the gridRowEnd property. In the gridRowEnd, we have two options. We can use the keyword span and specify how many rows we want this item to span. In our case, it's 2. So it starts from row line 1.

There's one other way to specify our end column value. The last line number 3, let me inspect and show you. The column line 3 can also be referenced as column line minus 1. So the column lines can also be counted from the right as minus 1, minus 2 and minus 3. So we can change the grid column end to minus 1 also. This works as well. We wouldn't use negative values. Usually you can use them mostly when you have four or five columns and when you want one of the items to end at the last line, then the value minus 1 is convenient to specify last line. Now, we just saw how to move around items in the grid and make them span across rows and columns using four different properties, grid-column-start, grid-column-end, grid-row-start and grid-row-end. But these properties are quite verbose. So we do have some shorthand properties which are more commonly used than these. These two