Fixed page layout with navbar & toolbar visible

Questions
1

I am stuck on how to have a page with fixed (non-scrolling) content where some of the content is aligned at the top (but below the navbar) and some aligned to the bottom (above the toolbar).

I tried creating an absolutely-positioned div inside the page, but the content of the div extends behind the navbar at the top and behind the toolbar at the bottom. So my content gets hidden.

How do I construct a div such that the top of the div is just below the navbar and the bottom of the div is just above the toolbar? That would be so helpful, thank you!

Here is a Fiddle that illustrates what I’m trying to do:

http://jsfiddle.net/aaroniba/2p1vo7s6/11/

2

Figured it out!

Just needed a div with style “height:100%” inside the page-content.

This fiddle shows how it’s done, for those who are curious: http://jsfiddle.net/aaroniba/2p1vo7s6/15/