同じ高さのHTML DIVを2つ並べて作るには？

Question

私は2つのサイドバイサイドDIVを持っています.1つは静的コンテンツを持ち、もう1つは動的コンテンツを持っています。動的DIVの高さの増加に伴って静的DIVの高さを増やしたいと思います。これまで

私のコードは次のとおりです。

<div class="row"> 
    <div class="col-sm-2">abc(STATIC CONTENT)</div> 
    <div class="col-sm-10"> DYNAMIC CONTENT</div> 
</div> 

Answer 1

.row { 
 
    display: flex; 
 
    width: 500px; 
 
    background: red; 
 
    padding: 20px; 
 
} 
 
.col-sm-2, 
 
.col-sm-10 { 
 
    flex: 1; 
 
    padding: 5px; 
 
} 
 
.col-sm-2 { 
 
    background: lime; 
 
} 
 
.col-sm-10 { 
 
    background: cyan; 
 
}

<div class="row"> 
 
    <div class="col-sm-2">abc(STATIC CONTENT)<br/> adding more height <br/> ... and some more</div> 
 
    <div class="col-sm-10"> DYNAMIC CONTENT</div> 
 
</div>

トピックflexboxesに深く潜るにはを参照してください：http://osvaldas.info/flexbox-based-responsive-equal-height-blocks-with-javascript-fallback