如何從同位素磚石

Question

我使用的同位素砌體畫廊，但發現很難除去行之間的頂部/底部的空白頂部/底部邊緣（見圖片）

我怎樣才能去做這個？

我正在使用的代碼是基於以下幾點： http://simbyone.com/animated-masonry-gallery-with-filters/

如前所述，我直接使用的代碼從上面包括JavaScript和CSS該網址。對於圖像的HTML是使用PHP，但輸出創建如下：

<div id="gallery-content"> 
    <div id="gallery-content-center"> 
         <div class='wrapper suggestion all film any later' id='3'> 
          <span class='relevance'> 
           <span class='badge'>87%</span> 

          </span> 
           <img src='cabinet/item/img/3.jpg' class='all film any later' alt='Film 1'/> 
          <span class='text'><i class='fa fa-check-circle-o btn-icon up'></i> <i class='fa fa-times-circle-o btn-icon down'></i> <i class='fa fa-heart-o btn-icon fav'></i><br>Film 1 later</span> 
         </div></div></div> 

我也是用在圖像上懸停文字：

 .wrapper img { 
     filter: grayscale(100%); 
     -webkit-filter: grayscale(100%); /* For Webkit browsers */ 
     filter: gray; /* For IE 6 - 9 */ 
     -webkit-transition: all .6s ease; /* Transition for Webkit browsers */ 
    } 

    .wrapper img:hover { 
     filter: grayscale(0%); 
     -webkit-filter: grayscale(0%); 
     filter: none; 
    } 

    .wrapper .text { 
     position:relative; 
     bottom:65px; 
     left:10px; 
     width: 150px; 
     overflow: visible; 
     visibility:hidden; 
     color: #fff; 
     font-size: 20px; 
    } 

    .wrapper:hover .text { 
     visibility:visible; 
    } 

    .wrapper .relevance { 
     position:relative; 
     top:30px; 
     left:250px; 
     visibility:hidden; 
     color: #a9a9a9; 
     z-index: 99999; 
    } 

    .wrapper:hover .relevance { 
     visibility:visible; 
    } 

    .wrapper .relevance .badge { 
     font-size: 16px; 
     background-color: #333; 
    } 

編輯： 看來，如果我申請的高度.wrapper它處理它，但作爲圖像的高度會有所不同，我似乎無法緊緊包裹，在它的形象。任何建議，我怎麼能做到這一點的高度：汽車只是給我留下了什麼，我已經

Answer 1

我發現周圍的工作，雖然我不是100％，如果是要走的路，但我加邊距： -25％的所有圖像，它似乎已經成功了。可能不適合所有的情況，但時間會證明一切

#gallery-content-center img { 
    width: 100%; 
    height: auto; 
    margin-bottom: -25%; 
}