我希望我的所有盒子都有相同的高度 我使用CSS显示:flex,它适用于第一个块,但不是他的孩子 它适用于Firefox,但不适用于Chrome 我在getbootstrap上找到了row-eq-height类,但它在chrome上并不是更好
我有一个div类row-eq-height然后是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>
和css
.row-eq-height {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.panel-container .server-box {
height: 100%;
}
感谢那些会理解并回答我的人!