title: Layout positioning issue: a not required action header div should influence the position of the scrollable content div
body: <p>Okay there are 2 scenarios:</p>
  
  <p>I have a layout like this:</p>
  
  <pre><code>----------------
  button header
  ----------------
  Contents
  Contents
  Contents
  Contents (with scrollbar)
  Contents
  ------------
  footer
  ------------
  </code></pre>
  
  <p>What I want to achieve is:
  The buttonheader and footer must always stay in view - the content must be scrollable.
  <strong>The buttonheader can be empty - thus the scrollable content should move above the 
  buttonheader - there is no point in losing space if there is no buttons</strong>.</p>
  
  <p>So absolute/fixed positioning seems to not be an option so I tried with relative. (The reason absolute is no solution, is because if the contents are placed absolutely there, they will never move in case the buttonheader is empty.)</p>
  
  <p>I set the height to percentage - but It will of course look very bad in case someone resizes the window.</p>
  
  <p>Look here and resize the outputwindow:</p>
  
  <p><a href="http://jsfiddle.net/6HbSN/" rel="nofollow">sad attempt on how to get a working relative positioned scrollable content</a></p>
  
  <p>The second version:</p>
  
  <p><a href="http://jsfiddle.net/6HbSN/2/" rel="nofollow">is to show what it should behave like (at the top part) - content should stick to top of the page - footer is wrong here</a></p>