Grid area help

Hello Team! I’m a bit confused with this grid-area property from the given example. For the .a selector the dimensions for grid-row is 5 / 7; and grid-column is 1 / span 2;.

When refactoring to grid-area how come the dimensions change to 5 / 1 / span 2 / span 2; ? Where does the 2nd “span 2” come from, i thought the row-end was 7?

Hi. row-start being at 5, if it spans 2 it will end at 7 :wink:

Oooooh that makes sense now! Thank you! I guess I was thinking about it too hard lol.

No worries, it’s easy to go too far when your head is in it :slight_smile:

1 Like