Bootstrap縮略圖圖像間距

我遇到了一個奇怪的問題。出於某種原因，我的縮略圖中的圖像不是「填充」縮略圖圖像部分。縮略圖邊框和圖像之間有一段很好的間距。 Bootstrap縮略圖圖像間距

我正在嘗試刪除您在圖層周圍看到的空白區域。我已經嘗試width: 100%

.thumbnail img { 
    width: 100%; 
} 

    .thumbnail { 
    box-shadow: 0 0 23px black; 
}

我希望IMG一路走縮略圖

HTML代碼的邊緣

<div class="col-md-9"> 
         <div class="row hidden-xs hidden-sm"> 
          <img src="../images/Signs/SignsFrontPageBanner.gif" class="img-rounded header" style="max-width: 100%; "> 
         </div> 

         <div class="row"> 

          <h1 id="featured">Sign Templates</h1> 

          <div col="col-md-8 col-md-offset-2"> 
           <div class="btn-group btn-breadcrumb"> 
            <a href="http://inksigns.com/InkSigns/index.html" class="btn btn-default"><i class="glyphicon glyphicon-home"></i></a> 
            <a href="#" class="btn btn-default active">Signs</a> 
           </div> 
          </div> 
          <div class="col-sm-4 col-lg-3 col-md-4"> 
           <div class="thumbnail backgroundhover"> 
            <a href="RealEstateSigns/RealEstateSign-index.html"><img src="../images/RealEstate/RealEstateSignThumbnail.gif" class="img-rounded"></a> 
            <div class="caption"> 
             <h4 class="pull-right"></h4> 
             <h4 style="text-align: center;"><a href="RealEstateSigns/RealEstateSign-index.html">Real Estate</a> 
          </h4> 
             <p>Take a look at our wide assortment of Real Estate Signs & Accessories.</p> 
            </div> 

           </div> 
          </div> 

          <div class="col-sm-4 col-lg-3 col-md-4"> 
           <div class="thumbnail backgroundhover"> 
            <a href="../Banners/GeneralBanners.html"><img src="../images/Banners/BannerThumbnail.gif" class="img-rounded "></a> 
            <div class="caption"> 
             <h4 class="pull-right"></h4> 
             <h4 style="text-align: center;"><a href="../Banners/GeneralBanners.html">Banners</a> 
          </h4> 
             <p>Take a look at our wide assortment of Banners.</p> 
            </div> 

           </div> 
          </div> 

          <div class="col-sm-4 col-lg-3 col-md-4"> 
           <div class="thumbnail backgroundhover"> 
            <a href="../Magnets/magnets-index.html"><img src="../images/Magnets/FrontPageMagnetThumbnail.gif" class="img-rounded "></a> 
            <div class="caption"> 
             <h4 class="pull-right"></h4> 
             <h4 style="text-align: center;"><a href="../Magnets/magnets-index.html">Magnets</a> 
          </h4> 
             <p>Take a look at our wide assortment of magnets.</p> 
            </div> 

           </div> 
          </div> 

          <div class="col-sm-4 col-lg-3 col-md-4"> 
           <div class="thumbnail backgroundhover"> 
            <a href="Decals/DecalSigns-index.html"><img src="../images/Decals/DecalsThumbnail.gif" alt="" class="img-rounded "></a> 
            <div class="caption"> 
             <h4 class="pull-right"></h4> 
             <h4 style="text-align: center;"><a href="Decals/DecalSigns-index.html">Decals</a> 
          </h4> 
             <p>Take a look at our wide assortment of Decals.</p> 
            </div> 

           </div> 
          </div>

來源

2016-01-04 Charles

您的圖像或包含圖像的div有填充。你應該嘗試將縮略圖設置爲** padding：0; ** - 如果失敗，請在包含的div上嘗試。如果這些作品都不起作用，那麼請發佈jfiddle，我會爲你找到它。 – Joel

發佈html代碼 – roll

如果我添加了填充：0到背景懸停，它將調整img並刪除填充。但是，當我添加填充：0到縮略圖類沒有任何更改 – Charles

我加入padding: 0px !important;到.thumbnail固定的問題，它需要！重要的

來源

2016-01-04 23:18:03 Charles

Bootstrap縮略圖圖像間距

回答

相關問題