关于html：100%高度的问题


Problems with 100% height

我正在尝试使用宽度为 20%、高度为 100% 的侧面板，以便它们根据浏览器的宽度和高度等重新调整大小。我遇到了高度问题(100%) CSS 的一部分，但它似乎不适合浏览器窗口的整个高度 - 它只显示侧面板中的 100%。

无论里面有多少内容，如何使侧面板到达页面底部？

1
2
3
4
5
6
7
#sidebar{
    float:left;
    position: relative;
    width: 20%;
    height: 100%;
    background-color: red;
}
相关讨论

身高100%总是很痛苦。

确保 html, body 也有 height: 100% 和任何包裹它的 div。

当你用百分比设置某些东西时，你必须始终考虑"百分比什么？"它总是元素的父元素。那么父设置是什么？如果父级没有以单位定义的高度，则百分比没有参考。

相关讨论

我在做的一个项目中遇到了同样的问题，因此我修复了它：

1
2
3
4
5
6
#sidebar{
    min-height:100%;
    height:auto !important;
    height: 100%;
    //add other styling needed
}