Two DIVs of Equal Height?

[Ottens]

I'm looking for a fresh solution to this classic problem. My site is:
http://www.ottens.co.uk/gatehouse/

I want the right DIV to adjust to the height of the left DIV which holds the content. To do so, I've been using this JavaScript thus far:

//<![CDATA[
onload=function() {
document.getElementById('right').style.height=
document.getElementById('black').offsetHeight +"px";
}
//]]>

Of course, being a CSS-purist, I'd rather fix this in CSS alone. I don't care much for the faux columns solution. I've also tried adding a huge margin with a minimum padding to the DIVs, but that for some reason screws up the coding of my forums, which uses the same stylesheet.

Help would be greatly appreciated!

[sobrien79]

Can't you just give #content a background color of black and adjust the width of it to be only as wide as both columns (and margins and padding)?

[Ottens]

Then for some reason it centers the entire site ?

[Ottens]

Correction: I tweaked it a bit so that it worked with setting a background color on the "container". Hopefully it'll work in I.E. too....

Thanks for the tip, Mr Sobrien!