phpmysqlclassstylespanels

I want to put panels side by side with bootstrap


I fetch some info from the database with a while loop to output panels side by side with boostrap.

This is the code:

<?php

    $sql = "SELECT * FROM items ORDER BY `id`"; 

    $res = mysqli_query($conn,$sql);

    $x = 4;

    while($page = mysqli_fetch_assoc($res)){ 
        echo "<div class='col-lg-$x col-md-5'>
                 <div id='posts' class='transitions-enabled masonry'>".
                   "<div class='box panel panel-default masonry-brick' style='position: absolute; top: 0px; left: 0px;'' target='_blank>".
                      "<a href=''><img src=''></a>". 
                         "<h2 class='box_text_hover'>". $page["name"]"."</h2>".(float)$page["price"]." ". 
                          "<a href='item.php?id=".$page["id"]."'>See more!</a>".
              "</div></div>". 
            "</div>"; 
          $x+=2;
        }
    mysqli_close($conn);
?>

But the output is always looks like this:

enter image description here


Solution

  • Please add the full code of your php. It seems like you are not assigning a "col-sm-4" class to your div class="panel panel-default". The number 4 is the width of your panel. The sum of these numbers echoed with your while loop can't be higher than 12.