我有一个带有两个内部 div 的 OUTER div:
- 其中一个是VERTICAL SIDEBAR,它的内容很短
- 第二个是 MAIN PAGE 的 div,其内容各不相同
它们都设置为 float: left,因此它们彼此相邻。
我已经了解到,当以百分比设置高度或最小高度时,所有的 parent 也需要指定他们的高度。
我希望它们都被拉伸(stretch)到页面的末尾。还没设法做到这一点,当 MAIN PAGE div 长于显示器高度时,问题就开始了(所以需要有滚动条),然后我通常以 MAIN PAGE div 中那个令人讨厌的滚动条结束,或者我以 SIDEBAR div 太短结束。
最佳答案
好的,你应该像这样设置外部 div 的 css
.outer{
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
overflow:auto;
}
这会将外部 div 设置为完全填充窗口,并使用侧边栏滚动页面其余部分的长度。您将只有一个主侧滚动条。
现在,如果您希望侧边栏正好填满页面。像这样设置它的 CSS:
.sideBar{
position:absolute //can be relative if necesary.
top:0;
bottom:0;
overflow:none;
}
现在这会将侧边栏设置为外部 div 的确切高度。所以它将跨越整个页面并且溢出设置为无以确保没有滚动条。
现在外层 div 和侧边栏 div 的高度应该由主 div 决定,你应该只有一个干净的滚动条。
关于web - 两个 div 拉伸(stretch)到页面末尾,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16269749/