如何使两个div的高度彼此相等?

2023-12-07

这里我在类行中有两个引导面板。
我试图使两个面板的高度彼此相等,即使在面板内放置了任何数量的数据<div class="panel-body"></div>任何面板。

下面是我的html

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<div class="row">
        <div class="col-md-6">
            <div class="panel panel-default">
                <div class="panel-heading">Panel Heading</div>
                <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
                <div class="panel-footer">Panel Footer</div>
            </div>
        </div>

        <div class="col-md-6">
            <div class="panel panel-default col">
                <div class="panel-heading">Panel Heading</div>
                <div class="panel-body">
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.

                </div>
                <div class="panel-footer">Panel Footer</div>
            </div>

        </div>
    </div><br><br>

任何帮助将不胜感激。谢谢


您可以申请row-eq-height to the row班级。这将使该行中的所有面板都等于最高的面板。

参见示例:https://jsfiddle.net/m7jyh1ex/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使两个div的高度彼此相等? 的相关文章