如何在同一高度上分配一行中的元素？

Question

我得到了一個小引導問題。 我打印具有角（納克重複）幾個元件和容器調節其高度的圖像的高度..

View of my recipes

代碼：

<div class="row text-center"> 
    <div class="col-lg-3 col-md-12 col-sm-12" ng-repeat="recipe in purchasedRecipes"> 
     <a href="{{recipe.PdfUrl}}" target="blank"> 
      <div class="thumbnail"> 
       <img src="{{recipe.ImgUrl}}" alt=""/> 
       <div class="caption"> 
        <h3>{{recipe.RecipeName}}</h3> 
       </div> 
      </div> 
     </a> 
    </div> 
</div> 

寬度容易與分配bootstrap（class="col-lg-3 col-md-12 col-sm-12"）我如何分配一個固定的響應高度，以便我的食譜是同一行大小的行？

感謝您的幫助:)

Answer 1

見here。前三名是：

matchHeight.js

• matchHeight.js Docs
• matchHeight.js GitHub

使用表

，他們給的例子：

@media only screen and (min-width : 768px) { 
    .is-table-row { 
     display: table; 
    } 
    .is-table-row [class*="col-"] { 
     float: none; 
     display: table-cell; 
     vertical-align: top; 
    } 
} 

巨大的負面保證金和積極填充

其代碼：

.row.match-my-cols { 
    overflow: hidden; 
} 

.row.match-my-cols [class*="col-"]{ 
    margin-bottom: -99999px; 
    padding-bottom: 99999px; 
}