title: CSS background-image alignment issue
body: <p>My background image won't align between the divs in this code - I have tried clearing them to no avail. Anyone know what's causing it, or how I can get it to work? CSS in html for convenience.</p>
  
  <pre><code>&lt;div class="header" style="height:200px; background-image: url(bg.png); margin:-8px;"&gt;
  &lt;img src="logo.png" style="margin-left:auto; margin-right:auto;" /&gt;
  &lt;/div&gt;
  
  &lt;div style="text-align:center;"&gt;
      &lt;div style="background-image: url(bg.png);background-position:center;  
  display:inline-block; width:90px; border-bottom-left-radius: 20px;"&gt;Div 1&lt;/div&gt;
      &lt;div style="background-image: url(bg.png);background-position:center;  
  display:inline-block; width:400px;margin:-4px;"&gt;Div 2&lt;/div&gt;
      &lt;div style="background-image: url(bg.png);background-position:center;  
  display:inline-block; width:90px;border-bottom-right-radius: 20px;"&gt;Div 3&lt;/div&gt;
  &lt;/div&gt; 
  </code></pre>
  
  <p>Here's a fiddle: <a href="http://jsfiddle.net/FphKk/" rel="nofollow">http://jsfiddle.net/FphKk/</a></p>
  
  <p>Image: <a href="http://i.imgur.com/YLVpI.png" rel="nofollow">http://i.imgur.com/YLVpI.png</a></p>