Html Firefox中所有元素的高度相同,但不包括Chrome

Html Firefox中所有元素的高度相同,但不包括Chrome,html,css,twitter-bootstrap,flexbox,Html,Css,Twitter Bootstrap,Flexbox,我希望我所有的箱子都一样高 我使用了CSS-display:flex,它对第一个块很好,但对他的孩子不起作用 它在Firefox上运行良好,但在chrome上不起作用 我在getbootstrap上找到了row eq height类,但在chrome上并不更好 我有一个div类行eq高度,然后是一个col-md-4和一个面板 面板高度不希望更改 守则: <div class="row-eq-height"> <div class="col-md-4">

我希望我所有的箱子都一样高 我使用了CSS-display:flex,它对第一个块很好,但对他的孩子不起作用 它在Firefox上运行良好,但在chrome上不起作用 我在getbootstrap上找到了row eq height类,但在chrome上并不更好

我有一个div类行eq高度,然后是一个col-md-4和一个面板 面板高度不希望更改

守则:

<div class="row-eq-height">

        <div class="col-md-4">
            <div class="panel panel-default no-padding server-box">
                <!-- Default panel contents -->
                <div class="panel-heading title-box">Regrowth</div>
                <!-- Table -->
                <table class="table server-table">
                    <tbody>
                    <tr>
                        <th>Adresse IP</th>
                        <td>#</td>
                    </tr>
                    <tr>
                        <th>Joueurs en ligne</th>
                        <td class="progress-bar-wrap">
                            <div>
                                <span style="width: 0%;"></span>
                                  <span class="progress-bar-content">0
                                                    /50</span>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <th>Statut</th>
                        <td><img src="#" alt="status"></td>
                    </tr>
                    <tr>
                        <th>Ms/Tps</th>
                        <td class="good-tps">2.8 ms / 20 tps</td>
                    </tr>
                    <tr class="heads-tr">
                        <td class="heads-td">
                            <div class="heads">

                            </div>
                        </td>
                    </tr>
                    </tbody>

                </table>
            </div>
        </div>
        <div class="col-md-4">
            <div class="panel panel-default no-padding server-box">
                <!-- Default panel contents -->
                <div class="panel-heading title-box">InfinityHard</div>
                <!-- Table -->
                <table class="table server-table">
                    <tbody>
                    <tr>
                        <th>Adresse IP</th>
                        <td>#</td>
                    </tr>
                    <tr>
                        <th>Joueurs en ligne</th>
                        <td class="progress-bar-wrap">
                            <div>
                                <span style="width: 6%;"></span>
                                                <span class="progress-bar-content">3
                                                    /50</span>
                            </div>
                        </td>
                    </tr>
                    <tr>
                        <th>Statut</th>
                        <td><img src="#" alt="status"></td>
                    </tr>
                    <tr>
                        <th>Ms/Tps</th>
                        <td class="#">7.1 ms / 20 tps</td>
                    </tr>
                    <tr class="heads-tr">
                        <td class="heads-td">
                            <div class="heads">
                                <img src="#" alt="Melkutus" data-toggle="tooltip"
                                     data-trigger="hover" data-placement="bottom" title="Melkutus">
                                <img src="#"
                                     data-toggle="tooltip" data-trigger="hover" data-placement="bottom"
                                     title="FortunateTrollz">
                                <img src="#" alt="Asseo" data-toggle="tooltip"
                                     data-trigger="hover" data-placement="bottom" title="Asseo">

                            </div>
                        </td>
                    </tr>
                    </tbody>

                </table>
            </div>
        </div>
    </div>

感谢那些理解我并回答我的人

添加对齐项:拉伸;到.row eq height类或尝试flex:1;在子项(.row eq height>*)上等待片刻。您在哪里使用.row eq高度等级?我在HTMLindeed的任何地方都看不到它,我写错了类,很抱歉我尝试了你的建议,但它仍然不能正常工作,col-md-4 div具有row eq height div height,但col-md-4 div中面板的高度在.panel容器中完全不变。服务器盒规则仅适用于面板容器中的服务器盒。如果您去掉了祖先连接器,它会工作:
    .row-eq-height {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;
}
.panel-container .server-box {
    height: 100%;
}