title: HTML Center align div with another div to left
body: <p>I can center align 1 div in a page easy just by using the CSS,</p>
  
  <pre><code>margin: auto;
  </code></pre>
  
  <p>This works great but I am having a problem when I want to keep this div center aligned, but also have another div in line to the left.</p>
  
  <p>This is what I would like <a href="http://jsfiddle.net/E25JV/20/" rel="nofollow">http://jsfiddle.net/E25JV/20/</a> but have the 2 div's lined up together. (I am only using text in the div's to keep in simple but there is actually a canvas and a bunch of other stuff).</p>
  
  <p>I have tried floating one div to the left but I get <a href="http://jsfiddle.net/E25JV/21/" rel="nofollow">http://jsfiddle.net/E25JV/21/</a>. As you can see they are not exactly lined up and the 1 div that is supposed to be in the center has moved over to the right.</p>
  
  <p>How can I get 2 div's lined up with 1 div in the center and 1 on the left.</p>
  
  <p>EDIT:</p>
  
  <p>The example I gave was just 2 div's with text to keep it simple. What I actually have is a canvas inside 1 of the div's -> <a href="http://jsfiddle.net/E25JV/38/" rel="nofollow">http://jsfiddle.net/E25JV/38/</a>.</p>