从其孙子 div 的最大高度设置容器 div 的最小高度答案

【问题标题】：Set minimum height of container div from maximum height of its grandchild's divs从其孙子 div 的最大高度设置容器 div 的最小高度
【发布时间】：2014-09-17 09:38:34
【问题描述】：

我有这个代码工作

$('document').ready(function(){

var max = Math.max.apply(null, $(".content").map(function() {
    return $(this).outerHeight();
}));
$(".container").height(max);

});

对于这个 HTML

<div class="container">
<section class="section" >
    <div class="content">
        <div class="inner_content">
             <p>...</p>
        </div>
    </div>
</section>
<section class="section" >
    <div class="content">
        <div class="inner_content">
             <p>...</p>
        </div>
    </div>
</section>
<section class="section" >
    <div class="content">
        <div class="inner_content">
             <p>...</p>
        </div>
    </div>
</section>
</div>

输出

<div class="container" style="height: 500px;">...</div>

我只想要“最小高度：500px;”代替“高度：500px;”

有人可以帮忙吗？提前致谢。

【问题讨论】：

api.jquery.com/css

标签： javascript jquery html css

【解决方案1】：

改变这个：

$(".container").height(max);

到这里：

$(".container").css("min-height",max);

【讨论】：

【解决方案2】：

（推荐）您可以考虑：Plain HTML/CSS columns techniques

另一种选择是手动执行此操作，在 JavaScript 中，您可能想要获取孙辈的所有身高并比较最大值，然后使用 How to set minHeight in javascript 设置属性和该值

【讨论】：

【解决方案3】：

使用 JQuery .css() 方法设置 max-height 属性。

$(".container").css('max-height',max);

【讨论】：