Javascript 扩展父div'；s的高度适合浮动和；无贷款儿童存款

我有一个父div

#modal_share

，其定义高度为

400px

。我希望它能够在原来隐藏的新子div变为可见时，将其高度扩展到包含所有子div

问题：现在，当一个隐藏的子div

.modal\u error\u msg

可见时，这个新可见div下面的一些div会被推到其父div之外

如何使父div

#modal_share

扩展其高度以包含所有可见的子div

JSFiddle:

CSS

#modal_share {
    width: 565px;
    height: 400px;
    position: relative;
    background: whiteSmoke;
    padding-top: 10px;      
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 3px 16px #222;
    -moz-box-shadow: 0px 3px 16px #222;
    box-shadow: 0px 3px 16px #222;
    display: none;  
}

.modal_big_hline {
    width: 100%;
    height: 1px;
    margin-top: 25px;
    border-top: 1px solid #CCC;
    float: left;
}

.modal_error_msg {
    width: auto;
    height: 15px;
    padding: 15px 25px;
    margin: 0px 25px;
    font-size: 12px;
    color: #B79000;
    border: 1px solid #E7BD72;
    background: #FFF3A3;
    clear: both;
    display: none;
}


#modal_big_button_container {
    height: 14px;
    width: auto;
    margin: 10px 25px 0px 25px;
    clear: both;
}

HTML结构

<div id="#modal_share">
    <div class="modal_error_msg"></div>
    <div class="modal_big_hline"></div>
    <div id="modal_big_button_container"></div>
</div>

---

对于父div

#modal_共享

将

高度

声明为

自动

，然后它将根据子元素自动调整高度。

将

modal_共享的高度设置为自动：

#modal_share {
    width: 565px;
    height: auto; //<----
    position: relative;
    background: whiteSmoke;
    padding-top: 10px;        
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 3px 16px #222;
    -moz-box-shadow: 0px 3px 16px #222;
    box-shadow: 0px 3px 16px #222; 
}

模式共享{
宽度：565px；
高度：自动//