Html css将左侧的一个项目和右侧的两个项目放在一起

我有3个div容器，我希望第一个div容器位于左侧，高度与右侧的2个容器一样大，但问题是右侧的容器没有包装在一个父容器中。基本上就是我想做的-

甚至可以在不改变html结构的情况下完成吗？或者唯一可能的解决方案是将这两个元素包装在一个父容器中

这是我的html结构-

<div class="container">
  <div class="block1">text here</div>
  <div class="block2">text here</div>
  <div class="block3">text here</div>
</div>

此处文本
此处文本
此处文本

---

谢谢你的帮助

我用

网格制作


.container{
显示：网格；
网格模板列：重复（3，1fr）；
高度：400px；
}
.货柜组{
颜色：#fff；
文本对齐：居中；
}
.区块1{
网格行：1/5；
网格柱：1/3；
背景：红色；
}
.区块2{
网格行：1/3；
网格柱：3/3；
背景：绿黄色；
}
.区块3{
网格行：3/5；
网格柱：3/3；
背景：道奇蓝；
}

此处文本1
此处文本2
此处文本3