Question

<div class="list-group">
  <p class="list-group-item-text">(one line)</p>
  <p class="list-group-item-text">(one line)</p>
  <p class="list-group-item-text">(two lines)</p>
</div>

我希望所有.list-group-item-text具有相同的高度，这是最大的高度。

因此，从上面的代码中，前两个项目将扩展到第三个项目的大小。

我尝试this solution，但没有回应。

修改：Here是解决方案，由karan3112

提供

Answer 1

使用以下代码循环遍历每个项目并使用temp变量来获取最大值。

将项目的内容包装在div中，在本例中为.list-group-item-wrapper

编辑：使用outerHeight（）

JS

    var temp = 0;
    $('.list-group .list-group-item-wrapper').each(function (index) {
      if($(this).outerHeight() > temp)
      {
        temp = $(this).outerHeight();
      }          
     });
    $('.list-group .list-group-item-wrapper').css('min-height',temp);

DEMO

使所有list-group-items的大小相同

1 个答案: