title: How to dynamically set div into multiple rows and two columns
body: <pre><code>&lt;div class="parent"&gt;
    &lt;div class="col"&gt;1&lt;/div&gt;
    &lt;div class="col"&gt;2&lt;/div&gt;
    &lt;div class="col"&gt;3&lt;/div&gt;
    &lt;div class="col"&gt;4&lt;/div&gt;
    &lt;div class="col"&gt;5&lt;/div&gt;
    &lt;div class="col"&gt;6&lt;/div&gt;
    &lt;div class="col"&gt;7&lt;/div&gt;
    &lt;div class="col"&gt;8&lt;/div&gt;
    &lt;div class="col"&gt;10&lt;/div&gt;
    &lt;div class="col"&gt;11&lt;/div&gt;
    &lt;div class="col"&gt;12&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Columns will be generated dynamically with php and I want to split this two column and multiple rows as it need. How can I do this.</p>
  
  <p>I want it will be like this.</p>
  
  <p>first row</p>
  
  <pre><code>1    6
  2    7
  3    8
  4    9
  5    10
  </code></pre>
  
  <p>Seccond row </p>
  
  <pre><code>11    16
  12    17
  13    18
  14    19
  15    20
  21
  </code></pre>
  
  <p>It means where previous row end, next row will start from there. </p>
  
  <p>it will be beneficial for me if it is possible with php when php loop generate these div.</p>