How to make such a Grid in antd ? I have not found how to set the height of the first element to 2 lines.
.container { display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr 1fr;
gap: 5px;
grid-auto-flow: row;
grid-template-areas:
"div1 div2"
"div1 div3";
}
.div1 { grid-area: div1; background-color:red ;}
.div2 { grid-area: div2; background-color:blue ;}
.div3 { grid-area: div3; background-color:green ;}
<div class="container">
<div class="div1">1</div>
<div class="div2">2</div>
<div class="div3">3</div>
</div>
I did it this way. But I'm not sure that this is the right way.with this method, I can't set equal margins as in css grid.
<Row>
<Col span={16} >
<img src={require('../../../../assets/images/img1.jpg')} alt=''/>
</Col>
<Col span={8}>
<Row>
<Col>
<img src={require('../../../../assets/images/img1.jpg')} alt=''/>
</Col>
<Col>
<img src={require('../../../../assets/images/img1.jpg')} alt=''/>
</Col>
</Row>
</Col>
</Row>