psyklopz psyklopz - 6 months ago 17
CSS Question

Force <div> to fill all available vertical space

I've seen a pile of ways to do this online, but all that I've tried either break other CSS on the page or don't work all together.

On this page http://www.psyklopz.com/workbench/ I would like to get the #container element to grow in height so that the footer touches the bottom of the screen.

How would you do that?

Answer

I ended up using position: fixed; and setting bottom: 0; top: 0; left: 0;. I then used a piece of jQuery .animate() magic to pull it off. Here's the working code and a demo all-in-one! http://www.psyklopz.com/workbench/jquery-based-dock-toolbar/

Comments