css - Make a Bootstrap column adjust to the height of an adjacent column -

i want 2 bootstrap columns alsways have equal size. scenario:

i want column text equal in height picture on left.

this markup (simplified):

<div class="row">     <div class="col-xs-8" id="brand-slider">         <div class="flexslider">             <ul class="slides">                <slides>             </ul>         </div>     </div>     <div class="col-xs-4" id="brand-aside">         <div class="brand-aside-content">           <text-content>           </div>     </div> </div> 

i've read many similar topic on stack , elsewhere, did not find viable solution. of them convoluted in way.

in different project working on, achieved effect suign js script calculated height of 1 column , applied adjacent column. however, believe there simpler solution.

would appreciate advice.

there 2 ways of solving this:

css:

use min-height , center content vertically.

js

get height of columns, compare them highest value, , apply height of them.

your js solution cleanest, css may simpler might end adding height both columns, or not setting min-height big enough 1 of them , cutting content out