How to make a Elastic Vertical Layout?

Question

I have a page that has 2 areas: header and content.
The header should be [of course] fixed at the top, and has no fixed height, and the content below it.

The point is that I need my content area to be scrolled if it overflows... Like: the header should be always there, but the content can be scrolled down, i.e. your browser window, with the bars always at the top and the page scrolling.

I'm using JS to do this in a different page, where the "footer" has a fixed height, so I could say "hey, content, use the page height minus the footer height".

Can I implement this with only HTML+CSS, or do I need to use JS? And how?

Answer 1

This should do it...

#header {
  position:fixed;
}