title: Have a div to fill out the remaining height/width of a container when sharing it with another div?
body: <p>Say I've got the following setup: </p>
  
  <pre><code>&lt;div class="A parent"&gt;
      &lt;div class="A a1"&gt;&lt;/div&gt;
      &lt;div class="A a2"&gt;&lt;/div&gt;
      &lt;div class="A a3"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS: </p>
  
  <pre><code>.A {
      width: 100%;
  }
  
  .parent {
      height: 300px;
      width: 300px
  }
  
  .a1 {
      height: 100px;
   }
  
  .a2 {
      height: 100px;
  }
  
  .a3 {
      // ??
  }
  </code></pre>
  
  <p>Is there any way I can get <code>.a3</code> to fill out the remaining height of the parent div, <em>without</em> any content and <em>without</em> explicitly stating its height? This would be so useful for responsive design. </p>