清除填充列產品信息Bootstrap 3

我有網站並使用Bootstrap 3.我的產品網格出現問題。我需要從我的產品列表中刪除填充。 www.shop11.kg 對不起我的英文。感謝清除填充列產品信息Bootstrap 3

<div class="tab-content"> 
<!-- Start gridview products --> 
<div id="grid-view" class="tab-pane fade in active" role="tabpanel"> 
    <div class="row"> 
     <!-- Start Single profuct --> 
     <div class="col-md-3 col-sm-4 col-lg-3 col-xs-12"> 
      <div class="single-product"> 
       <div class="product-thumb"> 
        <a href="/product/1264"> 
         <img class="front-img" src="/public/images/noimage/noimage_262.jpeg" alt="img"> 
        </a> 
       </div> 
       <div class="product-info"> 
        <div class="pro-title"> 
         <h4> 
          <a href="/product/1264" title="ARIEL COLOR Стиральный порошок для цветного белья автомат 15 кг "> 
           ARIEL COLOR Стиральный порошок для цветного белья автомат 15 кг 
          </a> 
         </h4> 
        </div> 
        <div class="pro-price-ratting"> 
         <div class="price-box"> 
          <span class="price">1580 сом</span> 
         </div> 
        </div> 
        <div class="product-action"> 
         <a href="javascript:void(0);" class="pro-btn add-to-cart">Купить</a> 
        </div> 
       </div> 
      </div> 
     </div> 
     <!-- End Single profuct --> 
    </div> 
</div> 
<!-- End gridview products -->

來源

2017-07-04 Imanali Mamadiev

您是否爲每件產品製作一行或一行？從你的例子中，它將是最後一個。從你的形象我不會說它的填充問題。更多的浮動之一，看看https://v4-alpha.getbootstrap.com/utilities/clearfix/ – Doomenik

您可以使用display:flex和flex-flow:row wrap在你行類，以便所有的項目將在適當包裹即

.row{ 
    margin-right: -15px; 
    margin-left: -15px; 
    display: flex; 
    flex-flow: row wrap; 
}

來源

2017-07-04 05:23:45 Dark

我必須去哪裏？ –

在你的css文件中，或者你可以使用內聯css''div class =「row」style =「display：flex; flex-flow：row wrap;」>' – Dark

謝謝，你是最棒的男人！ –

你可以給CSS像

.cp-right-products .tab-pane .col-md-3:nth-child(4n+1) { 
    clear: both; 
}

在平板電腦

查看您可以給CSS像

.cp-right-products .tab-pane .col-md-3:nth-child(3n+1) { 
    clear: both; 
}

那麼所有的項目將被妥善安排。

來源

2017-07-04 09:03:45

清除填充列產品信息Bootstrap 3

回答

相關問題