我有两列布局:
<html> <head></head> <body> <div id="container"> <div id="header"></div> <div id="sidewrapper"></div> <div id="contentwrapper"></div> </div> </body> </html>
我希望侧边栏和内容的高度均为100%,但最顶层容器的最小高度应为100%.
我尝试使用以下css解决它:
* { margin: 0; padding: 0; } html { font-family: Georgia,serif; color: #000; height:100%; min-height:100px; } body { background: #fff; height:100%; min-height:100px; overflow:hidden; } #header { width: 100%; position: relative; float: left; height: 23px; } #container { position:relative; width: 100%; height:100%; margin: auto; background:blue; } #contentwrapper { float:left; background:red; position: relative; width: 700px; padding:0px; margin:0px; height: auto; } #sidewrapper { float:left; position: relative; width: 159px; height:100%; padding:0px; margin:0px; }
…但由于标题的高度为23px,我得到一个滚动条.我尝试用overflow解决它:隐藏为body元素但我不知道这是否是正确的解决方案.
有任何想法吗?