title: Nested DIV elements
body: <p>I am trying to enclose two DIV elements, inner-1 &amp; inner-2, (dotted red border) inside a wrapper DIV (solid green border) but the wrapper DIV element does not expand to enclose the inner DIVs.</p>
  
  <p>What am I doing wrong?</p>
  
  <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  
  &lt;head&gt;
  &lt;meta http-equiv="content-type" content="text/html; charset=UTF-8"&gt;
  &lt;title&gt; Nested divs &lt;/title&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="wrapper" style="margin-left:auto; margin-right:auto; border:solid #669933;"&gt; 
    content inside "wrapper" div
    &lt;div id="inner-1" style="float:left; width:49%; border:dotted #CC3300;"&gt;
      content &lt;br /&gt;
      inside &lt;br /&gt;
      inner-1 div
    &lt;/div&gt;
  
    &lt;div id="inner-2" style="float:left; width:49%; border:dotted #CC3300;"&gt; 
      content inside inner-2 div 
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><a href="http://i42.tinypic.com/dcwp35.png" rel="noreferrer">Rendered HTML</a></p>