Full height and full width CSS layout

Question

I am looking for a way to create a CSS-only (no JavaScript) layout with 5 regions that looks like this:

   ┌────────────────────┐
   │          H         │
   ├─         


        

Answer 1

http://jsfiddle.net/aGG3V/

to set the header and footer height you have to set it in their style and also the .content padding and margin (this the negative version)