html - Bootstrap 如何修复动态列表数据

Question

我已经在我的页面中显示了列表项，但我无法显示它们。当我在每个元素中有不同的内容时，它不会匹配。我应该怎么办？我想移动左侧的最后一项并获得空间。

这是我的代码:

.single-profile-top, .single-profile-bottom {
  border: 1px solid #ddd;
  padding: 15px;
  position: relative;
  margin-bottom: 40px;
}

Answer 1

Jquery 可用于使所有列表数据具有相同的高度。

引用答案link

function setEqualHeight(selector, triggerContinusly) {
    var elements = $(selector)
    elements.css("height", "auto")
    var max = Number.NEGATIVE_INFINITY;

    $.each(elements, function(index, item) {
        if ($(item).height() > max) {
            max = $(item).height()
        }
    })

    $(selector).css("height", max + "px")

    if (!!triggerContinusly) {
        $(document).on("input", selector, function() {
            setEqualHeight(selector, false)
        })

       $(window).resize(function() {
            setEqualHeight(selector, false)
       })
    }


}
setEqualHeight(".sameh", true)