今天在修改一个网站的CSS,是想要分为左右两列,宽度不同,背景色不同.
结果就是ie7、firefox...这些浏览器无一例外的现实的效果都是长短不齐()IE6娘除外),如何让这两列可以自适应高度呢?

调试了半天,google了半天.找到许多解决办法,
采用Div+CSS进行三列或二列布局时,事先不知道具体高度,只能根据内容的增减自适应高度,
要使两列或三列的高度相同,用Table很容易实现,但采用 Div+CSS就显得比较麻烦了.
按照一般的做法,大都采用背景图填充或JS脚本的方法使高度相同,或者直接清除子容器的float属性.

但是上面这些办法我挨个试了又试,完全不管用..皇天不负有心人,终于让我找到了所有浏览器兼用的解决办法.

主要代码如下:

{overflow:hidden;}
{padding-bottom:100000px;margin-bottom:-100000px;}

用法:

#main{overflow:hidden;}
#main_left,#main_right{padding-bottom:100000px;margin-bottom:-100000px;}

父容器为body时一样.