CSS EQUAL HEIGHTS Using Min-Height vs. Height() - SEE - http://stackoverflow.com/questions/10771713/twitter-bootstrap-same-heights-on-fluid-columns
by bizamajig
HTML
<div class="clearfix" style="border: 1px solid #00f;">
<div class="colume1">"There is danger and misery at the edges." - Douglas Crockford, JavaScript: The Good Parts. "There is danger and misery at the edges." - Douglas Crockford, JavaScript: The Good Parts. "There is danger and misery at the edges." - Douglas Crockford, JavaScript: The Good Parts.</div>
<div class="colume2">"There is danger and misery at the edges." - Douglas Crockford, JavaScript: The Good Parts.</div>
</div>
CSS
.colume1{
border: 1px solid #f00;
float: left;
width: 150px;
}
.colume2{
border: 1px solid #0f0;
float: right;
width: 150px;
}
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
JavaScript
var max = -1;
$('.clearfix > div').each(function() {
var h = $(this).height();
max = h > max ? h : max;
$(this).css({'min-height': max});
});
//alert(max);