On a two-column page, how can I grow the left div to the same height of the right div using CSS or Javascript?

Question

I\'m trying to make a two-column page using a div-based layout (no tables please!). Problem is, I can\'t grow the left div to match the height of the right one. My right di

Answer 1

You can do it in jQuery really simple, but I am not sure JS should be used for such things. The best way is to do it with pure css.

1. Take a look at faux columns or even Fluid Faux Columns

2. Also another technique(doesn't work on the beautiful IE6) is to position:relative the parent container. The child container(the nav list in your case) should be positioned absolute and forced to occupy the whole space with 'top:0; bottom:0;'