title: Make multiple images cover entire viewport like css repeat
body: <p>The easiest way to describe this is to refer to my fiddle here:</p>
  
  <p>edit: had the wrong fiddle link, this is right though:</p>
  
  <p><a href="http://jsfiddle.net/b3rgstrom/k7qq4/2/" rel="nofollow">http://jsfiddle.net/b3rgstrom/k7qq4/2/</a></p>
  
  <p>Here is my CSS:</p>
  
  <pre><code>.dynamic {
    margin-top: 10px;
    position: relative;
    overflow: hidden;
    height: 200px;
    width: 100%;
  }
  .dynamic img{
    margin: -2px;
  }
  
  .repeat {
    position: relative;
    background-repeat: repeat;
    background: url("http://placehold.it/100x100");
    width: 100%;
    height: 200px;
    overflow: hidden;
    margin-top: 30px;
  }
  </code></pre>
  
  <p>I want to have a dynamic list of small images to cover the viewport within a fixed height area that covers the entire browser window from side to side.
  The problem is that the images don't show up until they have their fully needed space, which in my example is 100px.</p>
  
  <p>If I take one image and do a repeat, it will show as much of the image as needed to cover the entire screen from side to side, this is what I want to accomplish. </p>
  
  <p>Let me know if I can clarify.</p>
  
  <p>Any thoughts?</p>