You can give lines the same name and then use the span keyword to target lines of a certain name. This is really useful if you want to create a complex grid with multiple content tracks and gutters.

I have made a slightly larger grid here and have named all of the Grid Lines before the content tracks with col and all of the lines before the row tracks with row. I can then start at a certain column line by using col <line number> and span by saying span <number of lines>.

Credit to for inspiring this example.

[fl_row] {
    grid-gap: 10px;
    grid-template-columns: [col] 1fr [col] 1fr [col] 1fr [col] 1fr;
    grid-template-rows: [row] auto [row] auto [row];
[fl_row] .a {
    grid-column: col / span 2;
    grid-row: row ;
[fl_row] .b {
    grid-column: col 3 / span 2 ;
    grid-row: row ;
[fl_row] .c {
    grid-column: col ;
    grid-row: row 2 ;
[fl_row] .d {
    grid-column: col 2 / span 3 ;
    grid-row: row 2 ;
[fl_row] .e {
    grid-column: col / span 4;
    grid-row: row 3;