现在，我的橙色方块（弹性容器中的子方块）按预期工作，并且它们的高度相同，但我无法使其适用于红色方块。
我想让红色项目（孩子的孩子）的高度都与最高的高度相同。
我的 HTML 如下：
.container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-content: center;
}
.col {
flex: 1;
background:orange;
margin: 1px;
}
.col-item {
margin: 15px;
}<html>
<body>
<div class="container">
<div class="col">
<div class="col-item" style="background: red;">
<h2>Column 1</h2>
<p>Hello World</p>
</div>
</div>
<div class="col">
<div class="col-item" style="background: red;">
<h2>Column 2</h2>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
<p>Hello World!</p>
</div>
</div>
<div class="col">
<div class="col-item" style="background: red;">
<h2>Column 3</h2>
<p>Some other text..</p>
<p>Some other text..</p>
</div> …