title: Expanding a parent <div> to the height of its children
body: <p>I have a page structure similar to this:</p>
  
  <pre><code>&lt;body&gt;
    &lt;div id="parent"&gt;
      &lt;div id="childRightCol"&gt;
        /*Content*/
      &lt;/div&gt;
      &lt;div id="childLeftCol"&gt;
        /*Content*/
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>I would like for the parent <code>div</code> to expand in <code>height</code> when the inner <code>div</code>'s <code>height</code> increases.</p>
  
  <p><strong>Edit:</strong><br>
  One problem is that if the <code>width</code> of the child content expands past the <code>width</code> of the browser window, my current CSS puts a horizontal scrollbar on the parent <code>div</code>.  I would like the scrollbar to be at the page level. Currently my parent div is set to <code>overflow: auto;</code></p>
  
  <p>Can you please help me with the CSS for this?</p>