css - 将 DIV 停靠在屏幕的一侧

我正在尝试创建侧边栏。那么，设计应该是 3 个 div。页眉(已经完成)、侧边栏和主 div。

侧边栏旨在位于屏幕左侧，一直向下延伸到底部(高度:100%)。我遇到的问题是我无法制作 100% 的 Div，因为它的高度仅延伸到我在 div 中的文本行数。

这是我目前拥有的侧边栏的 CSS:

#sidebar {
    float: left;
    margin-top:36px;
    width: 300px;
    height:100%;
    background-color: #111211;
}

这是我目前拥有的主体的 CSS 代码:

body {
    margin:0;
    padding:0px;
    background-color:#87AFC7;
}

这是 HTML 代码:

<body>
  <div id="sidebar"> left-sidebar </div>
</body>

最佳答案

您需要将侧边栏父级的高度设置为 100%，然后依次将其父级设置为 100%。由于侧边栏是 body 元素的直接子元素，只需将其添加到您的 CSS 中:

html,body { height:100%; }

关于css - 将 DIV 停靠在屏幕的一侧，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11876634/