Question

I have a page with this structure:

topbar (100% width)
sidebar content

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

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

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

Answer 1

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

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

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