<style> header{ background-image: url("brood.jpg"); } body { font-family: Arial, Helvetica, sans-serif; font-size: 20px; } .grid { /* display: grid; grid-template-columns: repeat(2, 50%); you can change 1fr to whatever you want, 200px for example */ /* grid-column: 1 / 3; */ /* flex-flow: row wrap; */ /* flex-direction: row; flex-wrap: wrap; background-color: orange; */ } section{ display: grid; grid-template-columns: repeat(3, 1fr); /* you can change 1fr to whatever you want, 200px for example*/ gap: 2rem; /* width: 50%; */ /* display: grid; grid-template-columns: 1fr 1fr 1fr; grid-column-gap: 10px; grid-row-gap: 10px; */ /* display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; grid-auto-rows: minmax(100px, auto); */ background-color: orange; /* grid-column: 1; grid-row: 2 / 5; */ } .card{ height: 20%; } #myBtn { display: none; position: fixed; bottom: 20px; right: 30px; z-index: 99; font-size: 18px; border: none; outline: none; background-color: black; color: white; cursor: pointer; padding: 25px; border-radius: 50px; } #myBtn:hover { background-color: #555; } </style> <body> <!-- Navigation--> <?php include "navbar.php"; ?> <?php if(isset($_SESSION['USER_ID'])){ ?> <!-- Header--> <header class="bg-dark py-5"> <div class="container px-4 px-lg-5 my-5"> <div class="text-center text-white"> <!--Het werkt --> <h1 class="display-4 fw-bolder">Goedemorgen, <?php echo $_SESSION['USERNAME'];?></h1> <p class="lead fw-normal text-white mb-0">Quantity kan nog niet veranderd worden.</p> </div> </div> </header> <?php } else { ?> <!-- Header--> <header class="bg-dark py-5"> <div class="container px-4 px-lg-5 my-5"> <div class="text-center text-white"> <!--het werkt--> <h1 class="display-4 fw-bolder">Goedemorgen, Gast</h1> <p class="lead fw-normal text-white mb-0">Quantity kan nog niet veranderd worden.</p> </div> </div> </header> <?php } ?> <!-- Section--> <button onclick="topFunction()" id="myBtn" title="Go to top">↑</button> <?php include "config.php"; $sql = 'SELECT * FROM broodjes'; $stmt = $conn->prepare($sql); $stmt->execute(); $result = $stmt->get_result(); // get the mysqli result // maar als je test hier gooit dan pakt hij alleen de eerste // dit miscchien? https://stackoverflow.com/questions/13047909/styling-multiple-while-loop-results-getting-them-next-to-each-other echo '<section class="py-5">'; while($row = mysqli_fetch_assoc($result)){ //echo '<div class="grid">'; echo ' <div class="container1 px-4 px-lg-5 mt-5"> <div class="row gx-4 gx-lg-1 row-cols-2 row-cols-md-2 row-cols-xl-1 "> <div class="col mb-5"> <div class="card h-100"> <!-- Product image dit kan later nog wel--> <div class="fw-image"> <img class="card-img-top" src="brood.webp" alt="brood foto" /> </div> <!-- Product details--> <div class="card-body p-4"> <div class="text-center"> <div class="broodjes_ID"> <input type="hidden" name="broodjes_ID" value='. $row['broodjes_ID'] . '/> </div> <!-- Product name--> <div class="broodnaam"> <input type="hidden" name="broodnaam" value='. $row['broodnaam'] . '/> <h5 class="fw-bolder">'.$row['broodnaam']. '</h5> </div> <!-- Product price--> <div class="prijs"> <input type="hidden" name="broodnaam" value='. $row['prijs'] . '/> <h3> Prijs: </h3> <h3 class="fw-price"> €'.$row['prijs']. '</h3><br> </div> <!--voorraad--> '; if($row['voorraad'] == 0){ echo '<h3 class="fw-voorraad" style="color: red;"> uitverkocht</h3><br>'; echo '<div class="card-footer p-4 pt-0 border-top-0 bg-transparent"> </div>'; }else{ //link die misschien kan helpen https://www.withinweb.com/info/a-shopping-cart-using-php-sessions-code/ $broodjes = $row['broodjes_ID']; echo ' Voorraad: '.$row['voorraad'].'<br> </div> </div> <!-- Product actions--> <form action="cart.php?broodjes_ID='. $broodjes.'" method="POST" name="broodjes" value="" <div class="card-footer p-4 pt-0 border-top-0 bg-transparent"> <div class="text-center"><button class="btn btn-outline-dark mt-auto shop-item-button" type="submit" name="add_to_cart">Bestellen</button></div> </div> </form>'; } echo '</div> </div> </div>'; echo '</div>'; } echo '</section>';
I have tried putting more divs in my while loop but that also just shows the same result. tried changing the styling on the while loop but it still doesn't show the divs like [div][div][div]. I'm really out of options right now. can someone please help me?
display:grid
section
div
while
echo '<section class="py-5">'; while($row = mysqli_fetch_assoc($result)){ echo '<div class="container1 px-4 px-lg-5 mt-5">...'; ... } echo '</section>';
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)