css - 让子 div 列继承最高列的高度/填充整个父级高度

Question

可以在这里看到网站:http://storagestaging.com/pricing/

问题与四列定价网格有关。

我有一个四列定价网格。每列都有不同的高度(由于内容或多或少)。我想让所有四列都填满最高列的整个长度/填满整个父 div。

我试过 display: table 和 display:table-cell，并将 height=100% 添加到父 div 和子 div。有时我靠得更近，有时我只会让它变得更糟。非常感谢任何帮助。

谢谢!

Answer 1

如果你决定使用 div，一个 JS(这是一个 jQuery 版本，如果你需要 vanilla JS 让我知道)解决方案是可能的:

var max = 0;
$('.myDiv').each(function() {
    if ($(this).height() > max)
        max = $(this).height();
});
$('.myDiv').css('height', max + ' px');