在引导4中制作一个5列网格[复制]

Question

我想把5列列放在一起。行div。如果我从div中删除col-sm-6 col-md-3类，只需给出一个简单的。col类，也不会发生任何事情。

我给你看一张我的源代码的照片。如果我把一个. clearfixdiv放在每一个5. co div之后，为什么它不起作用？

    echo '<div class="row">';
$otodik = "";
                 include_once("files/show_products.php");
                 echo '</div>';

在while循环中：

    <?php while($item = mysqli_fetch_assoc($get_items)){ if($otodik%5 == 0) { echo '<div class="clearfix"></div>'; } ?>
<div class="col-sm-6 col-md-3 text-center mb-5">
    <a href="<?php echo $host; ?>/webshop/<?php echo $seolink_kat ."/". html($item['termek_seo']); ?>" class="" title="<?php echo html($item['termek_nev']); ?>">
        <img data-src="https://gras.hu/images/item/<?php echo html($item['termek_thumb']).t2(); ?>" alt="<?php echo html($item['termek_nev']); ?>" class="img-fluid main_product_thumb lazyload">
    </a>
    <h2 class="main_item_title">
        <a href="<?php echo $host; ?>/webshop/<?php echo $seolink_kat ."/". html($item['termek_seo']); ?>" class="" title="<?php echo html($item['termek_nev']); ?>"><?php echo html($item['termek_nev']); ?></a>
    </h2>
    
    
</div>
<?php $otodik++; } ?>
<div class="clearfix"></div>

Answer 1

它与引导4更简单，因为网格系统现在支持flexbox。您只需要向一行中的每一列添加类ol。

<div class="container">
    <div class="row">
        <div class="col mx-1">1</div>
        <div class="col mx-1">2</div>
        <div class="col mx-1">3</div>
        <div class="col mx-1">4</div>
        <div class="col mx-1">5</div>
   </div>
</div>