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

Your simplest answer lies in the next version of css (3), which currently no browser supports.

For now you are relegated to calculating heights in javascript and setting them on the left side.

If the navigation is so important to be positioned in such a way, run it along the top.

you could also do a visual trick by moving the borders to the container and the bigger inner, and make it appear to be the same size.

this makes it look the same, but it isn't.

  

    

     
nav1
     
nav2
     
nav3
     
nav4
    
 
 

  Lorem ipsum dolor sit amet, consectetur adipisicing elit,
  sed do eiusmod tempor incididunt ut labore et dolore magna
  Lorem ipsum dolor sit amet, consectetur adipisicing elit,
  ...