title: Stretch dynamic nested divs to fit fixed container?
body: <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;div class="a"&gt;dummy content&lt;/div&gt;
      &lt;div class="b"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong>
  </p>
  
  <pre><code>.container {
      height: 200px; /* Fixed height */
  }
  
  .a {
      height: auto; /* Dynamic height */
  }
  
  .b {
      height: 100%; /* I want this to fit inside .container, relative to .a */
  }
  </code></pre>
  
  <p>When .a gets a dynamic height of for instance 100px, I want .b to be .container height - 100px. I want this to happen automatically, with pure CSS.</p>
  
  <p>Please see my jsFiddle: <a href="http://jsfiddle.net/59MKS/" rel="nofollow">http://jsfiddle.net/59MKS/</a>.</p>
  
  <p>I would greatly appreciate any help with this.</p>