我在屏幕左侧有一个垂直菜单,我想采用 100% 的分辨率高度,但如果(菜单的)div 需要更多,我想显示滚动。 我的问题:我有一个 height:100% 和 overflow auto 的 div。 我只需要在那个 div 上滚动,但这个 div 必须是屏幕分辨率的 100%。现在,如果我这样放置,滚动会占据所有页面,但如果我将固定高度放置在 div 上,它就可以正常工作。但我需要达到 100% 的高度。 非常感谢!
最佳答案
<罢工> http://cssdesk.com/yxShB 罢工> <罢工> http://gearsdigital.com/sandbox/ 罢工> http://jsfiddle.net/WB4Qc/
成功测试:
操作系统
- FF 3.6
- Safari 4 + 5
- Chrome 47.0
WIN7
- IE 7
- IE 8
- FF 3.5
见我上面的例子。代码工作正常...尝试调整窗口大小。一旦浏览器底部到达最后一个列表元素,您就会看到菜单 div 上出现一个滚动条。
HTML:
<div id="menu">
<ul>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
<li>owepwew</li>
</ul>
</div>
CSS:
* {margin:0;padding:0;}
html, body{
height:100%;
background:#eee;
}
#menu {
background:#ccc;
width:220px;
height:100%;
}
#menu ul {
height: 100%;
overflow: auto;
}
关于css - 100% 高度 div 和溢出 :auto,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3387162/