CSS → grid-template-areas + subgrid

Пример размещения элементов сабгрида в именованных областях родительского грида:

<div class="container">
  <div class="header">
    <div class="item1">1</div>
    <div class="item2">2</div>
  </div>
  <div class="item3">3</div>
</div>

<style>
  .container {
    display: grid;
    grid-template-areas:
      'item1 item2'
      'item3 item3';
  }
  .header {
    grid-column: item1 / item2;
    display: grid;
    grid-template-columns: subgrid;
  }
  .item1 {
    grid-area: item1;
  }
  .item2 {
    grid-area: item2;
  }
  .item3 {
    grid-area: item3;
  }
</style>

Результат:

codepen.io