html - 均衡不共享同一个父元素的高度

Question

我知道这个答案已经被问过（以不同的方式），但还没有找到答案。

所以我有这个结构：

<div>
<div class="col">
    <div class="row">
        1
    </div>
    <div class="row">
        2 <br> 3
    </div>
    <div class="row">
        3
    </div>
</div>
<div class="col">
    <div class="row">
        1
    </div>
    <div class="row">
        2
    </div>
    <div class="row">
        3
    </div>
</div>
<div class="col">
    <div class="row">
        1
    </div>
    <div class="row">
        2
    </div>
    <div class="row">
        3
    </div>
</div>

如果它们不共享同一个父级，我如何平衡 cols 内行的高度？

有什么办法只使用 CSS 吗？

标签： htmlcssrows