title: one page horizontal site not centered on resize
body: <p>I'm developing my first one-page horizontal website using <a href="http://jquery.com/" rel="nofollow">jQuery</a> and the <a href="http://demos.flesler.com/jquery/scrollTo/" rel="nofollow">scrollTo</a> plugin. The site has 3 screens and starts centered (showing the middle screen). To accomplish this, the logical approach for me was to make <code>&lt;body&gt;</code> have <code>width:300%;</code>, with each screen having <code>width:33.3333%;</code>. When you click a <code>&lt;a&gt;</code>, jQuery sends you to another screen, going left or right.</p>
  
  <p>This works great, however when I try to resize my window I lose all structure, the widths stop making sense. I would like to know what I can do to fix this, but more importantly I would like to understand why this happens.</p>
  
  <p>Here's <a href="http://jsfiddle.net/Cthulhu/rKF2q/1/" rel="nofollow">Mr. Fiddle</a>. Resize your window and you'll see what's wrong. Thanks!</p>