<!--
https://codepen.io/kevinpowell/pen/OJaBNQE
-->

<div class="grid">
  <div class="grid-item"></div>
  <div class="grid-item"></div>
  <div class="grid-item"></div>
  <div class="grid-item"></div>
  <div class="grid-item"></div>
  <div class="grid-item"></div>
  <div class="grid-item"></div>
  <div class="grid-item"></div>

  <div class="grid-item offset"></div>
  <div class="grid-item"></div>
  <div class="grid-item"></div>
</div>



<style>
 .grid {
  margin: 2rem auto;
  max-width: 900px;
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(8, 1fr);
}

.grid-item {
  padding: 2rem;
  background: lightblue;
  border: 4px solid royalblue;

  grid-column: span 2;
}

.offset {
  grid-column: 2 / span 2;
}
</style>