可滚动的div填充可用高度

时间:2014-04-07 11:03:21

标签: css height overflow scrollable

iam目前正在尝试创建一个“拆分视图”网站,左侧是可滚动的导航栏,右侧是内容区域。

左侧的导航区域包含一个搜索字段(带有提交按钮),下方有一个类似于Windows资源管理器的可滚动树视图。

我环顾四周,找到了可滚动的div和div的解决方案,这些解决方案填充了窗口中剩下的高度,但是这些结合起来让我有些头疼

Iam正在寻找一种没有绝对定位的解决方案,因为创建的页面将被嵌入其他可能会破坏的地方。

以下是我到目前为止尝试过的演示:http://codepen.io/anon/pen/Aesgk/

正如您所看到的,我没有按照预期的2个滚动条,而是在右侧获得第三个滚动条,因为导航区域的高度。

提前致谢!

1 个答案:

答案 0 :(得分:-1)

试试这个CSS

height: 100%
overflow: scroll