jquery - 两个div的高度相等

标签 jquery html css flexbox

我有 2 个 div(每个 6 列)。左边的div是一张图片,右边的div是一些引用。我希望我的右侧 div 的高度与图像的高度相同。

enter image description here

这是我的代码:http://codepen.io/matysflance/pen/PZXdBK

<div id="testimonials" class="container-fluid testimonials">
    <div class="row">
        <div class="col-lg-6 image">
                <img src="http://placehold.it/1100x700/f3e42a" alt="">
        </div>
        <div class="col-lg-6 quote">
            <blockquote>
                <p>"Integer posuere erat a ante venenatis dapibus posuere veit al..." </p>
                <cite>Susan Sims, Interaction Designer at XYZ</cite>
            </blockquote>
        </div>
    </div>
</div>

最佳答案

你可以使用 jQuery 做到这一点

只需将 same-height 类添加到您想要具有相同高度的 DIV 中

jQUERY

jQuery(document).ready(function($) { //noconflict wrapper
    var heights = $(".same-height").map(function() {
        return $(this).height();
    }).get(),
    maxHeight = Math.max.apply(null, heights);
    $(".same-height").height(maxHeight);
});

关于jquery - 两个div的高度相等,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35342576/

相关文章:

android - 一致的布局,不同的手机分辨率,使用 JQuery Mobile

javascript - 在 javascript/jQuery 中存储字符串队列

javascript - 如何从点击功能中排除ID?

html - 如何按 100% 容器流体显示 block ?

javascript - 以编程方式隐藏不完整的元素

javascript - 单击滚动条时是否应运行单击处理程序

javascript - 使用字符串的日期对象

javascript - 在 CKEditor 中删除 HTML 元素

html - 如何使用 GET 请求从 http ://moz. com 获取域权限?

javascript - 如何禁用对 "twig"的评论?