如何让两个列的DIV高度一样高？

一个DIV里套两个DIV，一左一右，左边的DIV宽度固定，高度要根据内容自动延长，并且底部不能有多余的空白。右边的DIV要与左边的DIV高度始终保持相同（要显示背景色），左边DIV高度延长，右边DIV高度也自动延长且与左边的一致。CSS 应该怎么写？ 

PS：要求兼容Firefox和IE。 

页面布局如下： 
<div id="main"> 
<div id="left"></div> 
<div id="right"></div> 
</div>


实现代码如下：

<div id="main"> 
<div id="left"></div> 
<div id="right"></div> 
<script type="text/javascript"> 
document.getElementById("right").style.height = document.getElementById("left").offsetHeight + "px"; 
</script>
</div>