apply css to data that is being fetched from database

Question

i have a code that fetch data from database and display it on webpage, however while displaying data i wish to display it in a proper format that is each row should have maximum 5-6 items and number

1 2 3 4 5 6

7 8 9 10 11 12

13 .. and so on

 <?php  
    $con=mysqli_connect("localhost","root","","db");
    if (mysqli_connect_errno()) 
        {
            echo "Failed to connect to MySQL: " . mysqli_connect_error();
        }

    $student = mysqli_real_escape_string($con, $_POST['student']);
    $classid = mysqli_real_escape_string($con, $_POST['classid']);

    $result = mysqli_query($con,"SELECT * FROM class where classid='".$classid."'");
    while($row = mysqli_fetch_array($result)) 
        {
            $z=$row['studentid'];


            $resultt = mysqli_query($con,"SELECT * FROM  school where id='".$z."'");
            while($roww = mysqli_fetch_array($resultt)) 
                {
                    echo "<div class='ddd'>";
                        echo "<h5>";
                            echo "<ul>";
                                echo "<li>".$roww['student']."</li>";
                            echo "</ul>";
                        echo "</h5>";
                    echo "</div>";

                }


        }
    mysqli_close($con);
    ?>    

however i am not able to understand how to apply css so that each row gets fixed number of values in it

Answer 1

First of all, display all your results in a wrapper div.

?>
<div id="rest" style="width:99%">
<?php
$resultt = mysqli_query($con,"SELECT * FROM  school where id='".$z."'");
while($roww = mysqli_fetch_array($resultt)) 
{
    echo "<div class='ddd'>";
    echo "<h5>";
    echo "<ul>";
    echo "<li>".$roww['student']."</li>";
    echo "</ul>";
    echo "</h5>";
    echo "</div>";
}
?>

</div>

Then apply stylesheet.

<style>
#rest .ddd {
  width: 16.3%;
  float: left;
}
</style>

Explanation:

We are making #rest a parent and all the resultant div s to children

When we apply float: left , all the divs will reside side by side to the previous siblings.

If they do not get the required width, they will go to another line as if we have applied a line break.

You need 6 div s on a line, so 100/6 = 13.66 that would be the width of each child div.

Answer 2

You can use modulus lets say you want to break after each 6 items

$resultt = mysqli_query($con,"SELECT * FROM  school where id='".$z."'");
$i=1;
            while($roww = mysqli_fetch_array($resultt)) 
                {
                    echo "<div class='ddd'>";
                        echo "<h5>";
                            echo "<ul>";
                                echo "<li>".$roww['student']."</li>";
                            echo "</ul>";
                        echo "</h5>";
                    echo "</div>";

                         if( $i % 6 == 0){
                              Your code to break line like <br/> in HTML
                          }
                         $i++;

                }