not getting columns side by side

Question

I have a container that should display products in bootstrap grid, but instead of side by side I just get one column.

<div class="container">
    <div class="row text-center py-5">
        <div class='col-md-3 col-sm-3 my-3 my-md-0'>
            <form action='index.php' method='post' id='myform'>

                <?php
                $result = $database->getData();
                while ($row = mysqli_fetch_assoc($result)) {
                    component($row['product_name'], $row['product_price'], $row['product_image'], $row['id']);
                }
                ?>

            </form>
        </div>
    </div>
</div>

Answer 1

You just have 1 column in your code, you should have your col* div's inside the loop, something like this:

<form action='index.php' method='post' id='myform'>
  <div class="container">
    <div class="row text-center py-5">
      <?php
      $result = $database->getData();
      while ($row = mysqli_fetch_assoc($result)) {
      ?>
      <div class='col-md-3 col-sm-3 my-3 my-md-0'>
        <?php component($row['product_name'], $row['product_price'], $row['product_image'], $row['id']); ?>
      </div>
      <?php } ?>
    </div>
  </div>
</form>