可以通过JQ来获取右边高度再付值给左边。这样，右边内容再多，JQ也能把它的高度付值给左边，这样就会两边一样。
<script type="text/javascript" src="jquery-1.8.2.min.js"></script><script type="text/javascript">
//判断控制页面初始时左右的高度一致
var hl = $(".left").outerHeight() //获取左侧left层的高度
var hr = $(".right").outerHeight() //获取右侧right层的高度
var mh = Math.max(hl,hr) //比较hl与hr的高度，并将最大值赋给变量mh
$(".left").height(mh) //将left层高度设为最大高度mh
$(".right").height(mh) //将right层高度设为最大高度
</script>
还可以通过一些滚动插件：比如jQuery Scrollbars等，，，两边设置一致高度，然后右边多出来的内容就会出现一个滚动条，下拉来显示。
还可以设置左右两边高度一致，右边加上禁止溢出。。这样做，如果右边内容多出来了就不会显示出来，，
看你需要哪种，，
1、首先新建html文档，输入html5标准声明，如图所示。
2、然后输入html基本网页结构，如图所示。
3、接着输入hr标签<hr>是水平线，是单边标记，如图所示。
4、hr标签的常用属性，Size：设置水平线的粗细。
5、Width：设置水平线的宽度， Color：设置水平线的颜色，noshade：纯色显示，不带阴影效果。
6、最后运行网页，查看效果，如图所示，就完成了。
<hr>在chrome中默认是左对齐。在IE中默认是居中对齐，要想左对齐css中用text-align:left。<hr style="text-align:left">或 <hr align="left">
<hr>的颜色设置
<hr style="border:0background-color:#ff0000height:1px">
如果不加border:0的话，虽然颜色改变了，但是会显示一条黑色的边框。如果不加height:1px的话，在chrome会显示不出来。
