Hi, I am trying to implement a two-column fluid layout, where the *left-column*stacks *two* '<div class="well">'s and the *right-colum* stacks *three* '<div class="well">'s.
It should look like this: <https://lh3.googleusercontent.com/-r_HTS6U2DwA/UCv_2D9vLLI/AAAAAAAAAAc/NlChy0A5zfM/s1600/Screen+shot+2012-08-15+at+3.59.27+PM.png> There are two further requirements: 1. The total height (including the margin gap between blocks) of the left-column should be equal to that of the right-column. And this needs to be maintained even when the browser window resizes (of course, with bootstrap-responsive.css, all the blocks will be stacked into just one column when the width of the browser window gets too narrow, and that's fine). 2. I would like to adjust the height of each <div> block using the percentage of the height of the column it is in, while maintaining the equal total height requirement. This is what I have so far: http://jsfiddle.net/dTem2/. As seen from my CSS, I attempt to adjust the height percentage of each <div> block, but it doesn't seem to affect anything. So what is the proper way of doing this in Bootstrap 2?
