我正在尝试使用 HTML 和 CSS 制作一个简单的布局，该布局具有 100% 全屏高度，其中两列的高度相等，无论其中有多少内容。
就像现在一样，可滚动区域停在屏幕的高度，而不是页面的高度。请帮助我完成这项工作。我已经尝试了几乎所有我能找到的教程。
标记。
<html>
<body>
<div id="container">
<div id="sidebar"></div>
<div id="content"></div>
</div>
</body>
</html>
CSS 代码。
html,body {
height: 100%;
}
#container {
width: 600px;
height: 100%;
background-color: black;
}
#sidebar {
float: left;
width: 200px;
height: 100%;
background-color: blue;
}
#content {
float: left;
width: 400px;
height: 100%;
background-color: red;
}
最佳答案
我认为您做不到，它们是您在代码中暗示的方式(仅通过 CSS)。您可以使您的 #container 与 #content 大小相同，但不是#sidebar。您可以将您的样式放在您的容器上，因为它会随着 height: inherit 属性延伸。
这里有一些您可以尝试的其他示例 http://www.ejeliot.com/blog/61
另一种选择是对 #sidebar 进行 javascript 调整大小以匹配 #content，如果您对该路线感兴趣的话。
关于html - 全高停在浏览器视口(viewport)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5064342/