Как можно создать такой блок при помощи grid CSS?

Чтобы создать такой блок при помощи grid CSS, можно использовать следующий код:

HTML:
```html
<div class="grid-container">
  <div class="item1">1</div>
  <div class="item2">2</div>
  <div class="item3">3</div>
  <div class="item4">4</div>
</div>
```

CSS:
```css
.grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 10px;
  padding: 10px;
}

.item1 {
  grid-column: 1 / 3;
  grid-row: 1 / 3;
}

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

.item3 {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
}

.item4 {
  grid-column: 1 / 2;
  grid-row: 2 / 3;
}
```

Этот код создаст блок с четырьмя элементами, расположенными в сетке 2x2. Первый элемент (item1) занимает две строки и два столбца, остальные элементы занимают по одной строке и столбцу каждый.

Таким образом, используя grid CSS, можно легко и гибко контролировать расположение элементов на странице.