Ant Design: How to make items have equal heights

user_8737224 0
Viewed 14090

I use Ant Design in my react project. When I use the Row, I want all the columns in the Row have the same height.

What happens now:

enter image description here

What I expect:

enter image description here

Do you guys have any idea how to do it?

antd reactjs
3 Answers

Yeah, the Ant Row type property with the value flex will help you achieve this.

Try something like this : 

<Row type="flex">  
   <Col xs={12}>
   </Col>
   <Col xs={12}>
   </Col>
</Row>
user_93296420

Seems type="flex" is no longer supported. I've just set height="100%" to Col's first child. enter image description here

user_60820840

For me display:flex to every Col worked.

user_66574300
Related