HTML で dl の dt と dd の高さを揃える

背景がある場合はちょっと難しそうなのでJQueryで処理する

CSS

.about {

&-chronology {

border-bottom: 1px solid #d0cece;

@include pc {

display: flex;

flex-wrap: wrap;

}

dd, dt {

padding: 1em 2em;

}

dt {

border-top: 1px solid #d0cece;

background-color: #f7f7f7;

@include pc {

width: 22%;

}

}

dd {

background-color: #fff;

@include pc {

border-top: 1px solid #d0cece;

margin-left: auto;

width: 78%;

}

}

}

} 

jQuery

$('#information dt').each(function(){
if($(this).height()>$(this).next('dd').height()){
$(this).next("dd").css('height',$(this).height()+'px');
}
});