Grid example

by anmol sandal

HTML

<div class="wrapper">
  <div class="col-1 col"></div>
  <div class="col-2 col"></div>
  <div class="col-3 col"></div>
  <div class="col-4 col"></div>
</div>

CSS

.wrapper {
  display: grid;
  grid-gap: 10px;
}

.col {
  background: #ccc;
  min-height: 100px;
}

.col-1 {
  grid-column: 1/2;
  grid-row: 1/4;
}

.col-2 {
  grid-column: 2/5;
}

.col-3 {
  grid-column: 2/5;
}

.col-4 {
  grid-column: 2/5;
}