CSS Equal Size Columns

I have a 3 column design and would like to have equal columns for my right and left column as they are both navigational. Each column has their own background colour, so if the column height is different for all then it would look a bit weird.

However, i have a footer and would like to have the 3 columns to stop until the footer as the footer is having another background colour. Any idea how i can start?