Css 溢出时固定元素后面的内容_Css_Overflow

Css 溢出时固定元素后面的内容

css

Css 溢出时固定元素后面的内容,css,overflow,Css,Overflow,正如您在下面的代码笔中看到的，我有一个小布局，包括一个固定的标题和一个固定的边栏。在侧边栏的底部固定了另一个div，因此我想滚动侧边栏菜单，但侧边栏的底部固定了页脚（因此我在侧边栏中添加了属性overflow:auto；）问题是，当你缩小屏幕时，你可以在侧边栏上滚动，页脚是固定的，但是一些内容仍然保留在固定的div（以及滚动条）下为什么会发生这种情况？我如何修复它？谢谢为边栏容器添加填充（固定页脚高度）需要做一些更正首先，假设您为.sidebar body设置溢出，而不是.sideba

正如您在下面的代码笔中看到的，我有一个小布局，包括一个固定的标题和一个固定的边栏。在侧边栏的底部固定了另一个div，因此我想滚动侧边栏菜单，但侧边栏的底部固定了页脚（因此我在侧边栏中添加了属性

overflow:auto；

）

问题是，当你缩小屏幕时，你可以在侧边栏上滚动，页脚是固定的，但是一些内容仍然保留在固定的div（以及滚动条）下

为什么会发生这种情况？我如何修复它？谢谢

为边栏容器添加填充（固定页脚高度）

需要做一些更正

首先，假设您为.sidebar body设置溢出，而不是.sidebar container。因为您的固定页脚位于

.sidebar container

内，并且是

.sidebar body

的同级

假设您要计算

.sidebar body

的高度，因为您必须为其设置溢出

替换下面的CSS会有所帮助

从

.sidebar容器中移除溢出


为固定页脚添加高度，以便可以计算边栏正文的高度。边栏页脚{height:35px；}
在CSS下面添加边栏主体{高度：计算（100%-35px）；溢出：自动；}
或者高度：calc（100%-37px）；非常好用，非常感谢您的解释！！
    padding-bottom: 37px;