HTML/CSS Div不会一直向下运行

我正在尝试制作一个带有静态侧栏和可滚动文本的网站。我真的找不到我的内容分隔器不能一直向下运行的原因。我还想知道，是将内容分隔器修复好，还是在最底层继续使用它，这是更好的做法。查看页面如何不适合灰色分隔符

以下是我目前的代码：

HTML:

---

p.S.我设法通过添加溢出来解决这个问题：自动；我想在你的CSS中你也有

html，body{height:100%}

，通过对内容定义

height:100%

，你把它的内容限制在浏览器的大小上，这样背景就不会继续，你就会有溢出。使用

min height

代替height。您也在使用float，因此需要使用

overflow:auto

html，正文{
身高：100%；
}
#内容{
最小高度：100%；
溢出：自动；
背景颜色：浅灰色；
保证金：自动；
宽度：80%；
}
#边栏{
利润率最高：10%；
文本对齐：右对齐；
位置：固定；
底部：0；
浮动：左；
宽度：34%；
身高：70%；
}
#页面{
浮动：对；
宽度：54%；
}

这是侧边栏

这是第页

这是第页

这是第页

这是第页

这是第页

这是第页

这是第页

这是第页

这是第页

这是第页

这是第页

这是第页

这是第页

这是第页

...

我认为您应该使用最小高度，而不是高度，以获得适合以下内容的灵活高度：

#content {
min-height: 1000px;
}

我以这种方式工作，每次你应该尝试它时，它都会对我起作用

#content {
    height: 100%;
    background-color: lightgrey;
    background-attachment: fixed;   /* THIS DOES NOT WORK */
    margin: auto;
    width: 80%;
}
#sidebar {  
    margin-top: 10%;
    text-align: right;
    position: fixed;
    bottom: 0;
    float: left;
    width: 34%;
    height: 70%;
}
#page {
    float: right;
    width: 54%;
}

#content {
min-height: 1000px;
}