title: How can I center align an element that is larger than 100% of the entire page?
body: <p>I have a div width a with of 100% and hidden overflow holding a div with a width of 3000px.  I want the 3000px div to be cut off evenly on the left and right.  I would use background-position:center; however, it's more complicated than that. The 3000px div is holding 30 100px divs.  I have tried using auto margins on the left and right of the 3000px div, but it did not work.  Here is the css:</p>
  
  <pre><code>.bgAnimHolder{
      width:100%;
      height:500px;
      overflow:hidden;
      position:absolute;
      z-index:1;
      top:0px;
  }
  
  .row{
      margin: 0 auto 0 auto;
      height:500px;
      width:3000px;
  }
  
  .row div{
      width:100px;
      float:left;
      margin-top:0px;
  }
  </code></pre>
  
  <p>How can I arrange the 3000px div to be positioned in the middle of the screen, regardless of screen resolution? I am willing to use CSS or JavaScript, whichever is necessary to solve the problem. Thanks!</p>