I am trying to fetch data from database into Materialize CSS cards. What I want is only 3 cards in one row. After 3rd card in one row, it should display next 3 cards in next new row automatically.
And this is how I want to display it
And here is my code for that snapshot.
<?php
$cnt=1;
$sql=mysqli_query($db,"select * from addevent");
$row=mysqli_num_rows($sql);
while($row=mysqli_fetch_array($sql)){
echo"<div class='card amber lighten-1' style='grid-auto-flow:row; width:300px;margin-left:10px;'>
<div class='card-content'>";
echo "<span class='card-title activator teal-text text-darken-3'>".$row['EventName']."<i class='material-icons right'>more_vert</i></span>";
echo "<h6 class='teal-text text-darken-3'>".$row['Oname']."</h6>";
echo "<h5 class='brown-text text-lighten-3'>".$row['EventDate']." | ".$row['EventTime']."</h5>";
echo "<p class='deep-orange-text text-lighten-1'>".$row['EventAddress']."</p>";
echo"</div>";
echo"<div class='card-reveal'>";
echo "<span class='card-title orange-text text-lighten-1'>".$row['EventName']."<i class='material-icons right'>close</i></span>";
echo "<p class='teal-text text-lighten-2'>".$row['AboutEvent']."</p>";
echo"</div>";
echo"</div>";
}
echo"</div>";
?>
