具有全高垂直边框的列

Question

我希望此模型中的两个垂直边框具有相同的高度（即包含块的高度）：

如您所见，左边框看起来很好（因为左列是最高的列），但右边框太短（因为中间列比左列短）

我知道我可以通过给包含块一个明确的高度并给每个孩子100％的高度来做到这一点，但我不想这样做 - 而是我想允许不同的高度“论坛帖子持有人“没有丑陋的滚动条/溢出

Answer 1

你可以这样做......

HTML

<div id="container">
    <div id="left">
        abc
    </div>
    <div id="right">
        def
   </div>
</div>

CSS

#container {
       overflow: hidden;
}

#left,
#right {
   padding-bottom: 1000px;
   margin-bottom: -1000px;
}

jsFiddle

Answer 2

你的云使用这个精彩的jQuery代码 -

function equalHeight(group) {
var tallest = 0;
group.each(function() {
    var thisHeight = $(this).height();
    if(thisHeight > tallest) {
        tallest = thisHeight;
    }
});
group.height(tallest);
}

它基本上做的是找到组中最高元素的高度，并调整其他元素高度。这种方式即使您更改元素的内容仍将调整高度。 只需像这样调用函数

 equalHeight($('name_of_parent_element'));