使div行的內容集中在bootstrap

Question

我在使div行居中時出現問題，我有3個帖子來自wordpress，這相當於行內的3列，但它沒有居中後，我添加了很多css屬性讓它居中。我也在使用wordpress。

這裏是我的代碼：

<div class="row center-block"> 
<?php while ($offerBlog->have_posts()) : $offerBlog->the_post(); ?> 
         <div class="col-md-4 "> 
         <img src="<?php the_field('offer_image') ?>"> 
         <br> 
         <br> 
         <h4><?php the_field('offer_title') ?></h4> 
         <?php the_field('offer_description') ?> 
         </div> 
        <?php endwhile; ?> 

</div> 

這裏是我的CSS：

.col-md-4 { 
    width:15%; 
    margin:0 2.5%; 
    text-align: center 
} 
.center-block { 
    margin-left:auto; 
    margin-right:auto; 
    display:center; 
} 

Answer 1

試試這個：

檢查演示HERE

CSS：

.center-block { 
    display: flex; 
    flex-direction: row; 
    justify-content: center; 
} 

我希望它能幫助