title: Background position different in Chrome than Firefox or IE
body: <p>I have a background image 1322x622 where I place the content in the middle 660 px.  This is working fine for Firefox 19 (Windows and Ubuntu) and IE 8 but not with Chrome 25.  In Chrome, the background image position appears to be fixed.  The working browsers clip off the background as the browser window is resized smaller and vice-a-versa for resizing larger.</p>
  
  <p>I think the relative CSS is the following:</p>
  
  <pre><code>html {
      position: relative;
      left: 50%;
      margin-left: -661px;
      overflow-y: scroll;
  } 
  
  body {
      padding-top: 39px;
      overflow: hidden;
      position: absolute;
      width: 1322px;
      background: $mkdBrown;
      background-image: url("banana_tree.jpg");
      background-repeat: no-repeat;
  }
  
  #wrapper {
      padding-top: 39px;
      min-height: 550px;
      float: center;
      position: relative;
      margin: 0 auto 0 auto;
  }
  
  .container {
      width: 660px;
  }
  </code></pre>
  
  <p>The website is <a href="http://www.monkeykateanddaves.com/" rel="nofollow">http://www.monkeykateanddaves.com/</a> .</p>
  
  <p>TIA!</p>