我有一个 div,它是容器。此 div 包含 2 个 div 标签,如下所示:
<style type="text/css">
#container{
height:100%
}
#child1{
height:35px;
}
#child2{
overlow-y:auto;
height: ??? /**to match remain space of container**/
}
</style>
<div id="container">
<div id="child1">this is a child1</div>
<div id="child2">this is a child2</div>
</div>
如果 child2 的内容太多,如何设置 child2 的高度以匹配垂直滚动条容器的剩余空间?
最佳答案
一种选择是混合使用相对和绝对定位:
#container{
height:100%;
position: relative;
}
#child1{
height:35px;
}
#child2{
overflow-y:auto;
position: absolute;
width: 100%;
top: 35px;
bottom: 0;
}
你实际上根本没有设置高度,你让元素从顶部开始 35px
,从底部开始 0px
。
关于html - 如何设置div的高度匹配其容器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20026812/