title: Header, content and footer inside a div with position absolute
body: <p>I have a div element with absolute position. The position value is important and cannot be changed. How can I set a header, content and a footer inside that div? </p>
  
  <p>The height of the header and footer are fixed and the content should take all the space that is left. It's also important that header always stays on top and footer on bottom.</p>
  
  <p>The parent element should also be resizable with south resizable handle and the content should alter its height according to the height of the parent element. </p>
  
  <pre><code>.content {
      height: ?; /* What should this be?? */
  }
  </code></pre>
  
  <p>An example of the situation: <a href="http://jsfiddle.net/7gPzF/26/" rel="nofollow">http://jsfiddle.net/7gPzF/26/</a></p>