Равные высоты колонн

Question

Я хочу, чтобы восточные и западные дивизии простирались вниз, чтобы соответствовать высоте центра div ... возможно?

Большое спасибо.

.con{ 
padding-left: 22px; 
padding-right: 22px; 
overflow: hidden; 
} 

.col{ 
position: relative; 
float: left; 
} 

.west{ 
width: 7px; 
right: 22px; 
margin-left: -100%; 
background: url(http://www.example.com/west.png) repeat-y; 
padding: 0 0 0 15; 
} 

.east{ 
width: 7px; 
margin-right: -22px; 
background: url(http://www.example.com/east.png) repeat-y; 
padding: 0 15 0 0; 
} 

.center{ 
width: 100%; 
} 


<div class="con"> 
    <div class="center col"> 
    Test Text<br/> 
    Test Text<br/> 
    Test Text<br/> 
    Test Text<br/> 
    </div> 
    <div class="west col"> 
</div> 
<div class="east col"> 
</div> 
</div> 

Answer 1

Вы можете начать с того, что делается здесь для CSS только: HTML/CSS: Making two floating divs the same height

Или использовать макеты JavaScript.

Answer 2

Я использовал это решение JQuery и он прекрасно работает ...

var maxHeight = 0; 
$(".col").each(function(){ 
    maxHeight = $(this).height() > maxHeight ? $(this).height() : maxHeight; 
}).height(maxHeight);​ 

Просто FYI для других перспективных. Пытаюсь сфотографировать его.