php – change the default structure in CSS?

Whereas rendering the pictures within the webpage, their structure does not observe the conventional grid however the next one:

Contemplating I’ve used Bootstrap as a framework, I utilized a double class styling (notice the kid and dad or mum lessons) however it did not change the alignment. Is there a manner I can align the cells so that every certainly one of them occupies the identical area and the structure is rectangular somewhat than pyramidal?

whereas ($row = mysqli_fetch_array($end result)) {

 ?>
    <div class="col-md-3 dad or mum">

       <kind methodology="submit" motion="shporta.php?motion=add&serial=<?php echo $row["Nr_Seri"]; ?>">

         <div class="product youngster" >
               <img src="img<?php echo $row["URL"]; ?>" class="img-responsive">
               <h5 class="text-info"><?php echo $row["titulli"]; ?></h5>
               <h5 class="text-danger"><?php echo $row["Cmimi"]; ?></h5>
               <enter kind="textual content" identify="amount" class="form-control" worth="1">
               <enter kind="hidden" identify="hidden_name" worth="<?php echo $row["titulli"]; ?>">
               <enter kind="hidden" identify="hidden_price" worth="<?php echo $row["Cmimi"]; ?>">
               <enter kind="submit" identify="add" model="margin-top: 5px;" class="btn btn-success"worth="Shto ne Shporte"> 
           </div>
       </kind>
 </div>              

.col-md-3.dad or mum{
    show: flex;
    flex-wrap: wrap;
}

.product.youngster{
    flex-grow: 1;
    flex-basis: 25%;
}