Bootstrap: Empty spaces on layout due text size
<p>How can I avoid empty spaces in this layout?</p>

<p>Each item is an article, that are inside of a div, but when the text of one of the items is bigger, it creates an empty space on the next row. The items are created dynamically so I cannot control the text size. </p>

<p>Is my first time with Bootstrap so any advice is welcome.</p>

<pre><code>&lt;div class="row margin-top-30"&gt;
     &lt;article class="col-xs-12 col-sm-6 col-md-3"&gt;...&lt;/article&gt;
     &lt;article class="col-xs-12 col-sm-6 col-md-3"&gt;...&lt;/article&gt;
     &lt;article class="col-xs-12 col-sm-6 col-md-3"&gt;...&lt;/article&gt;
&lt;/div&gt;
</code></pre>

<p><a href="http://i.stack.imgur.com/AGO6L.png" rel="nofollow">Image with the example</a></p>

<p>Thanks!</p>