两个div并排显示问题
<div   id= "main ">
    <div   id= "left "> </div>
    <div   id= "right "> </div>
</div>

请问如何将left和right并排显示并且同样的高度？注意不能用height限定高度，因为right里边的内容属于不确定，如果限定高度会让页面乱！

请大侠指教！

------解决方案--------------------
请用“自适应高度”查找本版其他帖子，应该有不少例子

两列用嵌套自适应高度比较方便
------解决方案--------------------
<div style= "float:left "> wc </div> <div style= "float:left "> wc </div>

高度不一样时很容易出现排不齐。
------解决方案--------------------
光用css的padding和margin可以视觉上达到等高，
但是如果给每个div定义边框 下边框就会被遮挡~
下面是我的思路用脚本实现
=====================================
<style>
#left,#right {float:left;border:1px solid red; padding:10px;}
</style>
<div id= "main ">
<div id= "left "> 1111 </div>
<div id= "right "> 2222 <br> 2222 <br> 2222 </div>
</div>
<script>
var leftheight = document.getElementById( "left ").offsetHeight;
var rightheight = document.getElementById( "right ").offsetHeight;
if(leftheight> rightheight)
document.getElementById( "right ").style.height=leftheight;
else
document.getElementById( "left ").style.height=rightheight;
</script>
------解决方案--------------------
我刚完成这个问题.这个问题有几种方法解决.实践后觉得最佳方法是用图片背景解决.
CSS:
#mainbg{
float:left;
width:750px;
margin:0;
padding:0;
background:url( "mainbg.gif ") repeat-y top left;
}
#left{
float:left;
width:150px;
margin:0;
padding:0;
background:#333;
}
#right{
float:left;
width:600px;
margin:0;
padding:0;
background:#666;
}

html部分:
<div id= "mainbg ">
<div id= "left "> 左面的内容 </div>
<div id= "right "> 右面的内容 </div>
</div>

这样块left和right被套在一个叫mainbg的div块里，mainbg.gif是一条750px长的1px的水平直线前150像素颜色与左面背景相同，后600像素颜色与右面的相同。

这样左右两个块短的一块下的空白会被相同的背景颜色补充。形成一样高的假象。嘿嘿。目的达到。

发分发分:)