title: Div display using inline-block
body: <p>I am trying to display div in rows columns using online div. Here is the same</p>
  <p><a href="https://jsfiddle.net/sreeram62/b5d3s/1/" rel="nofollow noreferrer">https://jsfiddle.net/sreeram62/b5d3s/1/</a></p>
  <p>Same thing below:</p>
  <pre><code> &lt;style&gt;
  
  *{
      margin:0px;
      padding:0px;
  }
  .changed{
      display:inline-block;
      vertical-align:top;
  }
  
  
  &lt;/style&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div style=&quot;border:1px solid #F00; width:900px; min-height:1000px&quot;&gt;
    &lt;div class=&quot;changed&quot; style=&quot;width:220px; margin:3px; border:1px solid #0C0; height:30px;&quot;&gt;&lt;/div&gt;
    &lt;div class=&quot;changed&quot; style=&quot;width:220px; margin:3px; border:1px solid #0C0; height:20px;&quot;&gt;&lt;/div&gt;
    &lt;div class=&quot;changed&quot; style=&quot;width:220px; margin:3px; border:1px solid #0C0; height:30px;&quot;&gt;&lt;/div&gt;
    &lt;div class=&quot;changed&quot; style=&quot;width:220px; margin:3px; border:1px solid #0C0; height:30px;&quot;&gt;&lt;/div&gt;
    &lt;div class=&quot;changed&quot; style=&quot;width:220px; margin:3px; border:1px solid #0C0; height:37px;&quot;&gt;&lt;/div&gt;
    &lt;div class=&quot;changed&quot; style=&quot;width:220px; margin:3px; border:1px solid #0C0; height:30px;&quot;&gt;&lt;/div&gt;
  
  
  &lt;/div&gt;
  </code></pre>
  <p>If you see the second div in first row is small so the 5th one (2nd row second) one has to come up but the complete second row starts on same vertical line.</p>