title: How to create a Bootstrap thumbnails grid
body: <p>I have an unknown number of thumbs to display, here is an example of the HTML rendered:</p>
  
  <pre><code>&lt;div class="row-fluid"&gt;
          &lt;ul class="thumbnails"&gt;
            &lt;li class="span3"&gt;
              &lt;a href="#" class="thumbnail"&gt;
                &lt;img data-src="holder.js/260x180" alt="260x180" style="width: 260px; height: 180px;" src="mySrc"&gt;
              &lt;/a&gt;
            &lt;/li&gt;
            &lt;li class="span3"&gt;
              &lt;a href="#" class="thumbnail"&gt;
                &lt;img data-src="holder.js/260x180" alt="260x180" style="width: 260px; height: 180px;" src="mySrc"&gt;
              &lt;/a&gt;
            &lt;/li&gt;&lt;li class="span3"&gt;
              &lt;a href="#" class="thumbnail"&gt;
                &lt;img data-src="holder.js/260x180" alt="260x180" style="width: 260px; height: 180px;" src="mySrc"&gt;
              &lt;/a&gt;
            &lt;/li&gt;&lt;li class="span3"&gt;
              &lt;a href="#" class="thumbnail"&gt;
                &lt;img data-src="holder.js/260x180" alt="260x180" style="width: 260px; height: 180px;" src="mySrc"&gt;
              &lt;/a&gt;
            &lt;/li&gt;&lt;li class="span3"&gt;
              &lt;a href="#" class="thumbnail"&gt;
                &lt;img data-src="holder.js/260x180" alt="260x180" style="width: 260px; height: 180px;" src="mySrc"&gt;
              &lt;/a&gt;
            &lt;/li&gt;
            &lt;li class="span3"&gt;
              &lt;a href="#" class="thumbnail"&gt;
                &lt;img data-src="holder.js/260x180" alt="260x180" style="width: 260px; height: 180px;" src="mySrc"&gt;
              &lt;/a&gt;
            &lt;/li&gt;
            &lt;li class="span3"&gt;
              &lt;a href="#" class="thumbnail"&gt;
                &lt;img data-src="holder.js/260x180" alt="260x180" style="width: 260px; height: 180px;" src="mySrc"&gt;
              &lt;/a&gt;
            &lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
  </code></pre>
  
  <hr>
  
  <p><strong>Here is the result:</strong>
  <img src="https://i.stack.imgur.com/FUVY7.jpg" alt="screen shot"></p>
  
  <p><strong>Question</strong> : Since I build the UI dynamically, how can I avoid the margin on the second row without creating another <code>&lt;div class="row-fluid"&gt;</code></p>
  
  <p><strong>Update</strong> IE8 solution is required</p>