title: Make child div take max height
body: <p>I'm trying to make the <code>.box-content</code> <code>div</code> take the max height there is left inside boxA/boxB <code>div</code>. I got a <code>div</code> <code>.box-header</code> and a <code>.box-content</code> inside boxA/boxB <code>div</code>. The <code>.box-content</code> is sharing a <code>div</code> with the <code>.box-header</code>.</p>
  
  <p>In this <a href="http://jsfiddle.net/6sLcZ/10/">JSFiddle</a> you can see that the <code>.box-content</code> is going outside it's parent <code>div</code>.</p>
  
  <p>How can I solve this with pure CSS taking in account with these 2 rules: </p>
  
  <ol>
  <li>The height of the <code>.box-content</code> is stretchable (grow/shrink
  whenever window size changes);</li>
  <li>The <code>.box-content</code> has a minimum height of 200px;</li>
  </ol>