<div class="container">
<h1 class="text-center">Adding Items to Cart Using PHP</h1>
<div class="row">
<?php
$sql="select * from products";
$res=$con->query($sql);
if($res->num_rows>0)
{
while($row=$res->fetch_assoc())
{
echo '
<div class="col-sm-6 col-lg-4 col-xl-3 col-md-6 text-center">
<div class="card mb-4">
<a href="view.php?id='. $row['PID'] .'">
<img class="card-img-top" src="assets/images/'. $row['PIC'] .'" alt="">
</a>
<div class="card-body">
<a href="view.php?id='. $row['PID'] .'">
<h5 class="card-title">'. $row['PNAME'] .'</h5>
</a>
</div>
</div>
</div>
';
}
}
?>
</div>
</div>
If you observe the image above closely, there is a white gap on the left side of the image card. How can this gap be removed? Are there any CSS or Bootstrap codes that can solve this issue?