title: Need two div's to line up correctly
body: <p><a href="http://img410.imageshack.us/img410/1425/picture2ye4.png" rel="nofollow noreferrer">Here is a screenshot of how both div's lineup</a>.</p>
  
  <p>The left column is , the div that I want to line up to the right of it is </p>
  
  <p>And both those div's are within </p>
  
  <pre><code>.content-body {
      padding:10px 15px;
      font-size:.8em;
      font-family:arial;
      overflow:auto;
  }
  
  .col-left {
      float:left;
      position:relative;
      overflow:auto;
      height:100%;
      width:20%;
      padding:0 5px 0 0;
  }
  
  .col-middle {
      width:auto;
      height:auto;
      float:left;
      xmargin-top:5px;
      xfont-size:.8em;
      border:1px solid red;
      font-family:arial;
  }
  </code></pre>
  
  <p>How would I get the .col-middle div to line up properly?</p>
  
  <p>Any help is appreciated.</p>