The easiest way is to give the appearance of 100% height by giving the page a background image - centered, repeat-y. (Faux columns).
Once you have decided finally on your left and right column and content area widths, create an image same width as content wrapper, and about 20px in height, and colour the column areas as you want them to appear in your page.(add borders, effects as required) i.e:
faux/
Sorry about the colour scheme!
Edit note: To use this method, you would need to remove the existing background colours from your outerwrapper and its contained elements.
Alternatively, you could make the outerWrapper, contentWrapper and content divs 100% height, and set the property of contentWrapper overflow from 'hidden' to 'visible'(for editing in DW design view).
index2.html