<div class="parent">
<div class="child"> </div>
<div class="child"> </div>
<div class="child"> </div>
</div>
.parent {
display: flex;
justify-content: stretch;
.child {
flex:1;
margin:2px 1px;
border:1px solid #888;
background: #ececec;
}
}
$(document).ready(function(){
$('#mem').change(function(){
if ( $(this).val() === '64GB' ) {
$('.total-price-1').addClass('active');
$('.total-price-2').removeClass('active');
} else if ( $(this).val() === 'GB128' ) {
$('.total-price-1').removeClass('active');
$('.total-price-2').addClass('active');
}
});
<div class="dblock">
<div class="left"> </div>
<div class="right">
<div><p>1</p></div>
<div><p>1</p></div>
<div><p>1</p></div>
<div><p>1</p></div>
<div><p>1</p></div>
</div>
</div>
.dblock {
display:flex;
}
.left,.right {
flex: 1;
border: 1px solid red;
padding: .1em;
}
.right {
display:flex;
flex-direction: column;
align-items: flex-start;
}
.right>div {
border:1px solid #ececec;
}