title: How to make images line up in a row regardless of browser zoom level?
body: <p>It seems that no matter what I do, I can't get a row of images to line up horizontally when I zoom into the browser. When I zoom in, the images furthest to the right will drop down to the next row instead of going off screen. I've tried <code>float:left;</code>, creating a border, and <code>position:relative;</code> but no luck. </p>
  
  <p>If I use <code>position:absolute;</code> it seems like I have to manually position each image.</p>
  
  <p>My goal is make a sliding image gallery using jquery like the one here: <a href="http://www.elated.com/res/File/articles/development/javascript/jquery/elegant-sliding-image-gallery-with-jquery/" rel="nofollow">http://www.elated.com/res/File/articles/development/javascript/jquery/elegant-sliding-image-gallery-with-jquery/</a></p>
  
  <p>I don't want to copy the code in the link above, because I want to create everything from scratch by understanding the fundamental building blocks.</p>