title: Making a Pinterest-like grid with Bootstrap: the boxes are not displayed right below each other
body: <p>The HTML scheme is following:</p>
  
  <pre><code>&lt;div class="items"&gt;
    &lt;div class="item"&gt;...&lt;/div&gt;
    &lt;div class="item"&gt;...&lt;/div&gt;
    &lt;div class="item"&gt;...&lt;/div&gt;
    ...
  &lt;/div&gt;
  </code></pre>
  
  <p><code>.item</code> CSS style:</p>
  
  <pre><code>float: left;
  </code></pre>
  
  <p>And the result:
  <img src="https://i.stack.imgur.com/DVfhe.png" alt="enter image description here"></p>
  
  <p>But the white boxes are not aligned right one after another one -- where could be the issue? I;ve tried also using <code>display: inline-block;</code> instead of <code>float: left;</code>, but the result was basically the same.</p>
  
  <p>Thank you</p>