我有一个与此类似的页面结构:
<body>
<div id="parent">
<div id="childRightCol">
/*Content*/
</div>
<div id="childLeftCol">
/*Content*/
</div>
</div>
</body>
当内心的增加时,我希望父母div能够扩大.heightdivheight
编辑:
一个问题是,如果width子内容的内容扩展width到浏览器窗口之外,我当前的CSS会在父项上放置一个水平滚动条div.我希望滚动条位于页面级别.目前我的父div设置为overflow: auto;
你能帮我解决这个问题吗？
Dr *_*ack 516
为父母试试这个,它对我有用.
overflow:auto;
更新:
另一个有效的解决方案:
家长:
display: table;
孩子:
display: table-row;
ben*_*wey 26
添加一个clear:both.假设您的列是浮动的.根据您的身高指定父级的方式,您可能需要溢出:auto;
<body>
<div id="parent">
<div id="childRightCol">
<div>
<div id="childLeftCol">
<div>
<div id="clear" style="clear:both;"></div>
</div>
</body>
noi*_*isy 15
正如Jens在评论中所说
另一个答案是如何使div不大于其内容？...它建议设置display:inline-block.这对我很有用. - Jens Jun 2于5:41
在所有浏览器中,这对我来说效果更好.
小智 5
添加
clear:both;
到父div的css中，或者在父div的底部添加一个执行clear:both;的div
这是正确的答案，因为overflow:auto; 可能适用于简单的网页布局，但会弄乱开始使用负边距等的元素
小智 5
尝试付出max-content父母的身高。
.parent{
height: max-content;
}
https://jsfiddle.net/FreeS/so4L83wu/5/