title: Bootstrap columns float issue. DIVS need to be same height
body: <p>I have dynamically generated content formed into 3 bootstrap columns like this...</p>
  
  <pre><code>&lt;div class="col-md-4"&gt;
    &lt;div class="article"&gt;
    content goes here
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The problem is, when columns have different content, the different heights ruin the layout.</p>
  
  <p>How can I force a clear row to be started after every 3 items to avoid this?</p>
  
  <p>So basically...</p>
  
  <p><img src="https://i.stack.imgur.com/Wz49U.jpg" alt="enter image description here"></p>