title: Align items in 3's in PHP using HTML
body: <p>Good Day All, </p>
  
  <p>I am trying to align  items in a row of 3. At the top of each row there is a div called "". The purpose of this div is to open a new and after every 3 items the div must be close and another one opened. I have tried the below code to my suprise it is not working. This is very weird as the MOD operand should work. Cna any of you see what I could be doing wrong? </p>
  
  <p>The write picture should look like this <a href="https://i.stack.imgur.com/f3Hfg.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/f3Hfg.jpg" alt="enter image description here"></a>
  It is out of alignment and the blue colour fills the whole page. I do not know what I am doing wrong:            </p>
  
  <pre><code>$currentRow = 1;
      echo '&lt;div class="top-box"&gt;';
      while($Data=mysqli_fetch_array($Result))
          {
  
           echo '&lt;div class="col_1_of_3 span_1_of_3"&gt; 
             &lt;a href="Single.php?Query='.$Data[5].'"&gt;
              &lt;div class="inner_content clearfix"&gt;
                  &lt;div class="product_image"&gt;
                      &lt;img src="images/'.$Data[14].'" height="300" width="320" alt=""/&gt;
                  &lt;/div&gt;              
                  &lt;div class="price"&gt;
                     &lt;div class="cart-left"&gt;
                          &lt;p class="title"&gt;'.$Data[11].'&lt;/p&gt;
                          &lt;div class="price1"&gt;
                            &lt;span class="actual"&gt;R'.$Data[13].'&lt;/span&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="cart-right"&gt; &lt;/div&gt;
                      &lt;div class="clear"&gt;&lt;/div&gt;
                   &lt;/div&gt;             
                 &lt;/div&gt;
               &lt;/a&gt;
              &lt;/div&gt;';
  
               $currentRow++;
               if($currentRow % 3 == 0)
               {
                      echo '&lt;/div&gt;    ';
                      echo '&lt;div class="top-box"&gt;';
  
               }
          }
  </code></pre>
  
  <p>When I manually repeat the items every 3 items like below, it works perfectly: </p>
  
  <pre><code>    &lt;div class="top-box"&gt;
        &lt;div class="col_1_of_3 span_1_of_3"&gt;
           &lt;a href="Single.php"&gt;
           &lt;div class="inner_content clearfix"&gt;
              &lt;div class="product_image"&gt;
                  &lt;img src="images/1st_Party_Boy.jpg" height="300" width="320" alt=""/&gt;
              &lt;/div&gt;
              &lt;div class="price"&gt;
                 &lt;div class="cart-left"&gt;
                      &lt;p class="title"&gt;His First Party&lt;/p&gt;
                      &lt;div class="price1"&gt;
                        &lt;span class="actual"&gt;R350.00&lt;/span&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="cart-right"&gt; &lt;/div&gt;
                  &lt;div class="clear"&gt;&lt;/div&gt;
               &lt;/div&gt;             
             &lt;/div&gt;
             &lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="col_1_of_3 span_1_of_3"&gt;
              &lt;a href="Single.php"&gt;
              &lt;div class="inner_content clearfix"&gt;
              &lt;div class="product_image"&gt;
                  &lt;img src="images/Her_First_Party.jpg" height="300" width="320" alt=""/&gt;
              &lt;/div&gt;
               &lt;div class="sale-box"&gt;&lt;span class="on_sale title_shop"&gt;New&lt;/span&gt;&lt;/div&gt;
              &lt;div class="price"&gt;
                 &lt;div class="cart-left"&gt;
                      &lt;p class="title"&gt;Her First of Many &lt;/p&gt;
                      &lt;div class="price1"&gt;
                        &lt;span class="actual"&gt;R350.00&lt;/span&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="cart-right"&gt; &lt;/div&gt;
                  &lt;div class="clear"&gt;&lt;/div&gt;
               &lt;/div&gt;             
             &lt;/div&gt;
             &lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="col_1_of_3 span_1_of_3"&gt;
           &lt;a href="Single.php"&gt;
           &lt;div class="inner_content clearfix"&gt;
              &lt;div class="product_image"&gt;
                  &lt;img src="images/First_one_for_boys_and_girls.jpg" height="300" width="320" alt=""/&gt;
              &lt;/div&gt;
              &lt;div class="price"&gt;
                 &lt;div class="cart-left"&gt;
                      &lt;p class="title"&gt;Their First Birthday&lt;/p&gt;
                      &lt;div class="price1"&gt;
                        &lt;span class="actual"&gt;R350.00&lt;/span&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="cart-right"&gt; &lt;/div&gt;
                  &lt;div class="clear"&gt;&lt;/div&gt;
               &lt;/div&gt;             
             &lt;/div&gt;
           &lt;/a&gt;
          &lt;/div&gt;
          &lt;div class="clear"&gt;&lt;/div&gt;
      &lt;/div&gt;  
  </code></pre>