twitter-bootstrap-3 – Bootstrap 3等高的缩略图(类似于bootstr

发布时间：2020-12-17 21:21:27 所属栏目：安全来源：网络整理

导读：我有一排像这样的缩略图：我希望他们的身高相等.这是我的代码： div class="row text-center" div class="col-md-3 col-sm-6" div class="thumbnail" div class="caption" h3HOTKEY + COMBO/h3 pHotkey description goes here. Category only shown in expl

我有一排像这样的缩略图：

我希望他们的身高相等.这是我的代码：

<div class="row text-center">
    <div class="col-md-3 col-sm-6">
        <div class="thumbnail">
            <div class="caption">
                <h3>HOTKEY + COMBO</h3>
                <p>Hotkey description goes here. Category only shown in explore.</p>
                <p>
                    <a href="#" class="btn btn-default" data-tooltip="Change Hotkey">
                </p>
            </div>
        </div>
    </div>
    <div class="col-md-3 col-sm-6">
        <div class="thumbnail">
            <div class="caption">
                <h3>HOTKEY + COMBO</h3>
                <p>short desc</p>
                <p>
                    <a href="#" class="btn btn-default" data-tooltip="Change Hotkey">
                </p>
            </div>
        </div>
    </div>
    <div class="col-md-3 col-sm-6 hotkey-add">
        <div class="thumbnail">
            <div class="caption">
                <p></p>
                <p><a href="#" class="btn btn-default"><span class="glyphicon glyphicon-plus"></span></a></p>
            </div>
        </div>
    </div>
</div>

这可能吗？就像我们在bootstrap4中看到的,这里是相同的高度卡：

http://www.codeply.com/render/KrUO8QpyXP#

解决方法

似乎bootstrap 4,就像你在示例中所示,用于获得相同的高度,display：table表示容器div和display：table-cell表示内部的.

其他解决方案可以使用< table>而是< div>,使用flex属性…
结帐这个How can I make Bootstrap columns all the same height?

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!