我想制作一个具有两列固定宽度的页面，每一列都有自己的背景颜色，即使在向下滚动大内容时也能覆盖整个页面的高度。一张简单的图来说明:https://dl.dropbox.com/u/3060536/twocol.png
我找到了几个几乎满足我要求的解决方案。
- 随处放置
height:100%，只要您不滚动，看起来就很棒:这似乎与屏幕的高度有关(向下滚动较长的文本时背景会消失) . - 将
height:100%放在 html 和 body 上，并将min-height:100%放在其中一个 div 上，我可以让一列填满整个高度。但这需要直接在正文下方完成，因此它似乎无法与我想要的居中双列布局相结合。 - 将
padding-bottom:100000px和margin-bottom:-100000px放在列中，将overflow-y:hidden放在父级中，如果所有内容都适合屏幕，则工作正常，但如果文本不适合屏幕，它会完全删除向下滚动的选项。
所以以上都不是我想要的。执行此操作的正确方法是什么？
最佳答案
你可能会在这里得到一些想法..如果 position:relative 不打扰你，试试这个。
<html>
<head>
<title>sample</title>
</head>
<body style="height:100%;">
<center>
<div style="position:relative; width:900px; height:100%;">
<div style="position:relative; float:left; background-color:blue; width:200px; height:auto; min-height:100%;">
'//some texts or controls
</div>
<div style="position:relative; float:left; background-color:green; width:700px; height:auto; min-height:100%;">
'//some texts or controls
</div>
</div>
</center>
</body>
</html>
关于html - 有两列全高背景？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15181071/