How can I display the query result in 4 columns and move to another row after 4 columns?

Question

I have data in my phpmyadmin database table. And I want to display them in a page where the data will be displayed in 4 columns and move to another row for more data.

For example

1 2 3 4
5 6 7 8

I also want it to be responsive. I am using html and php in Sublime text software.

I am developing a website for restaurant and having problem displaying menu details(images, price, desc, etc) in a page using table format. Currently, my data are displaying in the one row and not responsive at all.

<?php 
      echo "<tr>";
      $subselect="SELECT * FROM menu ";
      $subret=mysqli_query($connection,$subselect);
      $subcount=mysqli_num_rows($subret);

      for($j=0;$j<$subcount;$j++)
      {                
        $row=mysqli_fetch_array($subret);
        $MenuName = $row['MenuName'];
        $MenuDesc = $row['Description'];
        $MenuPrice = $row['Price'];
        $MenuImage="MenuImage/" . "_" . $row['MenuImage'];

            list($width, $height, $type, $attr)=getimagesize($MenuImage);
            $w=200;
            $h=200;
            echo "<td align='center'>";
?>

    <section class="ftco-section"> //this is for the display section
      <div class="container">       
            <div class="blog-entry align-self-stretch">
              <img src="<?php echo $MenuImage ?>"width="<?php echo $w ?>" height="<?php echo $h ?>">
            <div class="text">
            <h3><?php echo $MenuName ?></h3>
        <p ><?php echo $MenuDesc ?></p>
        <p class="price"><span><?php echo $MenuPrice ?></span> mmk </p>
        <a href="" class="btn btn-primary btn-outline-primary">Add to cart</a>
        </div>
            </div>
        </div>
      </div>
    </section>  
<?php 
  }
?>

I want my data to be displayed like

1 2 3 4
5 6 7 8

Answer 1

Please try the below code:

  <style>
.text{
    padding:10px;
    float:left;

}
.clear{
    clear:both;
}
</style>

<?php 
 echo "<table>";
$subret = [1,2,3,4,5,6,7,8];
$loop_counter = $Break =  1;
$subcount=count($subret);
for($j=0;$j<$subcount;$j++)
{      
$row=$age= array("MenuName"=>"Name","Description"=>"Dec","Price"=>"43");
$MenuName = $row['MenuName'].'_'.$subret[$j];
$MenuDesc = $row['Description'].'_'.$subret[$j];
$MenuPrice = $row['Price'].'_'.$subret[$j];

if($Break == 1){
?>
<tr><td align='center'>
<section class="ftco-section">
<div class="container">       
<div class="blog-entry align-self-stretch">
<?php
}  
?>
    <div class="text">
    <h3><?php echo $MenuName ?></h3>
    <p ><?php echo $MenuDesc ?></p>
    <p class="price"><span><?php echo $MenuPrice ?></span> mmk </p>
    <a href="" class="btn btn-primary btn-outline-primary">Add to cart</a>
    </div>
<?php

if($loop_counter%4==0){ echo '</div></div></section></td></tr><div class="clear"></div>'; $Break = 1;}else{$Break = 0;}
$loop_counter++;
}
 echo "</table></tr>";
 ?>

Result: