動態高度autoheight

Question

我現在擁有的一切：Image

我知道的是，棕色div的高度將是動態的，所以我希望讓對方3周的div（藍色，灰色和紅色）調整/自動調整爲棕色div高度。 完成此操作的最佳方法是什麼？

下面是我的一些代碼：

<div class="row"> 

    {{--SCORES--}} 
    <div class="col-md-3" style="background-color: #2F96B4"> 
    </div> 

    {{--BOARD--}} 
    <div class="col-md-4" style="background-color: #8a6d3b"> 
    </div> 

    {{--PLAYERS AND SPECTATORS--}} 
    <div class="col-md-2" style="background-color: #666666"> 
    </div> 

    {{--CHAT--}} 
    <div class="col-md-3"> 
    </div> 
</div> 

注：是的，我使用的引導限制的div的寬度。

謝謝。

Answer 1

這種風格解決：

.Row { 
    display: table; 
} 

.Row [class*="col-"] { 
    float: none; 
    display: table-cell; 
    vertical-align: top; 
} 

Ref：How can I make Bootstrap columns all the same height?

Answer 2

您可能希望將它定義爲一個表：

.row { display: table; } 
.my_divs { display: table-cell; } 

，你不得不在.my_divs類添加到所有四個div的