使div填满整个页面的高度 [英] Make a div fill the whole page in height

问题描述

我有一个包含此结构的网页：

I have a page with this structure:

topbar（100％width）
侧栏内容

topbar (100% width) sidebar content

我想要侧边栏在高度填充屏幕的所有剩余空间。

i want the sidebar to fill all the remaining space of the screen in height.

我尝试过height：100％在我的CSS，工作。

I've tried with height: 100% in my css but doesn't work.

我该如何做？有一种方法使用css或我必须使用Javascript？

How can i do this? There is a way to do it using css or i have to use Javascript?

推荐答案

要实现这一点，你需要确保sidebar的父容器也有100％的高度。

To achieve this you need make sure the sidebar's parent containers have heights of 100%, too.

所以，如果你有一个侧边栏div，你有 body 容器和 html 容器。

So, if you have a sidebar div, you have the body container, and the html container.

html, body, #sidebar { height: 100%; }

这篇关于使div填满整个页面的高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！