Uses explicitly named grid lines.
Grid Exampule 4

Using grid line numbers

item1

← column 250px →

item2

  ↑

rows: 80px 1fr 80px

  ↓

item3

 ←         column 1fr            →


#wrap {
  display: grid;
  grid-template-columns: 250px 1fr;
  grid-template-rows: 80px 1fr 80px;
}

.item3 {
  grid-column-start: 2;
  grid-row-start: 1;
  grid-row-end: 4;
}

item4

Using named grid lines

item1
item2
item3

#wrap {
  display: grid;
  grid-template-columns: 250px [ item-start ] 1fr [ item-end ];
  grid-template-rows: [ item-start ] 80px 1fr 80px [ item-end] ;
}

.item2 {
  grid-column: 1 / item-start ;
  grid-row: 2 / item-start ;
}
.item3 {
  grid-column: item-start / item-end;
  grid-row: item-start / item-end;
}

item4

item-start

item-end

item-start

item-end

Using named grid area

item1
item2
item3

#wrap {
  display: grid;
  grid-template-columns: 250px [ item-start ] 1fr [ item-end ];
  grid-template-rows: [ item-start ] 80px 1fr 80px [ item-end] ;
}

.item2 {
  grid-column: 1 / item-start ;
  grid-row: 2 / item-start ;
}
.item3 {
  grid-area: item;
}

item4

item-start

item-end

item-start

item-end

next Grid Exanpule 1.html