title: How can I bottom align a div that can grow and cause it's container to scroll
body: <p>I'm trying to make this layout happen without javascript.</p>
  
  <p>I have a parent div and a child div that contains content which keeps being appended.  I want the child to be bottom aligned inside the parent and grow vertically.  I also want <strong>the parent div to scroll</strong> when the height of the child > height of parent.</p>
  
  <p><img src="https://i.stack.imgur.com/Uofuv.png" alt="Child expands from the bottom, causing parent to scroll"></p>
  
  <p>The first part is pretty easy with:</p>
  
  <pre><code>#child { position:absolute; bottom: 0 }
  </code></pre>
  
  <p>The second part is difficult because absolutely positioned elements are outside of the content-flow and won't trigger scrolling.</p>
  
  <p>The parent div spans the entire height of the browser window <em>(which I don't know at design-time)</em></p>