title: Zurb Foundation Block Grid causing horizontal scrollbar
body: <p>Just reported this as a possible issue on github, but maybe I'm just doing something wrong!</p>
  
  <p>Check out the fiddle to see this happening: <a href="http://jsfiddle.net/bu2Dw/1/">http://jsfiddle.net/bu2Dw/1/</a></p>
  
  <p>If you reduce the width of the window below the large page size, the negative margin that the default foundation css applies to the  element causes the horizontal scrollbar to appear.</p>
  
  <p>Just drop the following code into any foundation page and resize the window to see this happen. "Contain to grid" on the block grid div stops the scrollbar but it messes up the margins.</p>
  
  <pre><code>    &lt;div class="row"&gt;
          &lt;!-- Using both block grids together for different layouts --&gt;
          &lt;ul class="small-block-grid-2 large-block-grid-5"&gt;
            &lt;li&gt;&lt;img src="http://placehold.it/395x590" alt="image1" /&gt;&lt;/li&gt;
            &lt;li&gt;&lt;img src="http://placehold.it/395x590" alt="image2" /&gt;&lt;/li&gt;
            &lt;li&gt;&lt;img src="http://placehold.it/395x590" alt="image3" /&gt;&lt;/li&gt;
            &lt;li&gt;&lt;img src="http://placehold.it/395x590" alt="image4" /&gt;&lt;/li&gt;
            &lt;li&gt;&lt;img src="http://placehold.it/395x590" alt="image5" /&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  </code></pre>