如何在css网格的中心设置第三列？

我有三个div。如何将两个div作为列，但第三个div需要居中，一个没有网格区域的列

就像照片上一样

我尝试过：

 display:grid;
 grid-template-columns:1fr 1fr;
 grid-template-row:1fr 1fr;

但它可以创建四列。。而不是我需要的。。

---

创建一个包含4列的网格，每个div应跨越2列，最后一个子级应从第2列开始

.电网{ 显示：网格； 网格模板列：repeat4，1fr； 网格模板行：1fr 1fr； 网格间距：2px； } .grid>div{ 高度：20vmin； 宽度：20vmin:20vmin； 格构柱端部：跨度2； 背景：红色； } .grid>div：最后一个子项{ 网格列开始：2； }

---

使用flex而不是网格是一种选择吗？嗯，我更喜欢css网格，在flex中我不想使用宽度：50%。。