title: Divs not center aligning
body: <p>I have two divs, one placed left, one placed right. In the left div I have text, in the right div I have images. When I copy and paste the HTML underneath and repeat the same line of divs, the divs are just off of center. Why is that? here is my code - </p>
  
  <p>HTML - </p>
  
  <pre><code>&lt;div id="wrapper"&gt;
      &lt;div id="left"&gt;
  
      &lt;br&gt;&lt;br&gt;
  
      &lt;CENTER&gt; TEXT&lt;/CENTER&gt;&lt;/div&gt;
      &lt;div id="right"&gt;
  
      &lt;br&gt;&lt;br&gt;
  
          &lt;font-size: "14px;"&gt;
  
              IMAGE 
              IMAGE
              IMAGE
              &lt;br&gt;&lt;br&gt;
  
          &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS -</p>
  
  <pre><code>#wrapper {
      width: 100%;
      overflow: auto;
  }
  
  #left {
      float:left;width:48%;margin-right:1%;
  }
  
  #right {
      float:right;width:48%;margin-left:1%;
  }
  }
  </code></pre>