CSS height of columns again

Question

How, without background tricks, set the column of content#3 to equal with red column?

<div class="container">
<aside>
    content#1<br />
    content#1<br />
    content#1<br />
    content#1<br />
    content#1<br />
    content#1<br />
</aside>
<div class="some">
    content#2<br />
    content#2
</div>
<div class="some">
    content#3
</div>

Red and first blue columns are dynamic, but red always is longest.

Example: http://jsfiddle.net/eakDL/2/

Answer 1

So You add the following js:

setPositions = function (){
    var container = document.getElementById("container");

    var redHeight = container.children[0].offsetHeight;
    var blueOneHeight = container.children[1].offsetHeight;
    var blueOneBottomMargin = parseFloat(window.getComputedStyle(container.children[1]).marginBottom);

    var bluenTwoTopMargin = parseFloat(window.getComputedStyle(container.children[1]).marginTop);

    var blueTwoHeight = redHeight-(blueOneHeight+blueOneBottomMargin+bluenTwoTopMargin)+2; 

    container.children[2].style.height = blueTwoHeight+"px";
}

to your fiddle and you get this fiddle.