当子 div 的高度增加时增加外部 div 的高度

Question

我正在开发一个asp.net 网络应用程序。

master page 有一个子形式。母版页没有定义任何高度，但它为child form 定义了一个X px 高度。

在子窗体上，它有一个 fieldset 容器，在这 2 个 table container 和一个 container 中用于 gridview control。

据我所知，我已将 #mainOuter_box 的高度设置为 auto，并将子表单容器 (#child_contentbox1) 的高度设置为 auto。

但此策略未按预期工作。但是我也尝试过这个代码示例（我从这个 stackoverflow 问题线程 how to size a div's height to its container height, using CSS? 得到的，但我怀疑我是否写得正确。

$(document).ready(function(){ $("#mainOuter_box").css('height',$("#child_contentbox1").innerHeight()+$("#child_contentbox2").innerHeight()+$("#child_contentbox3").innerHeight()); });

当数据/记录增加gridview容器框的高度时，请建议我如何增加#mainOuter_box的高度。

谢谢！ update 这里是 jsfiddle 链接，我在其中附加了主表单的 css 和 html。 非常感谢您的热心指导！！ http://jsfiddle.net/nikhilbs09_1/325oes4m/

Answer 1

“当子div的高度增加时，增加外部div的高度”

如果要根据内容调整外部 div 的大小，则无需为外部 div 设置任何高度， 另一方面，如果您的 div 中有浮动元素，则需要使用 clear: both，或为外部 div 使用 .clearfix 类。

.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0px;
    visibility: hidden;
}