引導程序從縮略圖網格的行中刪除垂直空間

Question

我正在嘗試刪除縮略圖網格的行之間的垂直空間，就像我為該水平網格所做的那樣，但是沒有成功。

.gutter-0.row {
    margin-right: 0;
    margin-left: 0;
    /* not working */
    margin-top: 0; 
    margin-bottom: 0;
}
.gutter-0 > [class^="col-"], .gutter-0 > [class^=" col-"] {
    padding-right: 0;
    padding-left: 0;
    /* not working */
    padding-top: 0;
    padding-bottom: 0;
}

的HTML

    <div class="row gutter-0">
        <div class="col-md-4">
            <div class="thumbnail">
                <img src="http://placehold.it/200x200" alt="">
            </div>
        </div>
        <div class="col-md-4">
            <div class="thumbnail">
                <img src="http://placehold.it/200x200" alt="">
            </div>
        </div>
        <div class="col-md-4">
            <div class="thumbnail">
                <img src="http://placehold.it/200x200" alt="">
            </div>
        </div>
    </div>
    <div class="row gutter-0">
        <div class="col-md-4">
            <div class="thumbnail">
                <img src="http://placehold.it/200x200" alt="">
            </div>
        </div>
        <div class="col-md-4 col-sm-4">
            <div class="thumbnail">
                <img src="http://placehold.it/200x200" alt="">
            </div>
        </div>
        <div class="col-md-4 col-sm-4">
            <div class="thumbnail">
                <img src="http://placehold.it/200x200" alt="">
            </div>
        </div>

    </div>

自舉

我該怎么辦？ 謝謝

Answer 1

在“縮略圖”類上有一個底邊。

只需將其添加到您的CSS即可將其刪除：

.thumbnail {
  margin-bottom: 0;
}

自舉

Answer 2

.thumbnail底邊距為20px。 重置它或使用以下樣式。

.thumbnail{
  display: table-cell;
}

http://www.bootply.com/hDnBumWAdZ