filter神奇解决IE 6下负margin:-100%时布局问题

下面一个比较常见的三列布局：

mark up:

<div id="wrap" >
	<div id="main">
    	<div id="body"></div>
    </div>
    <div id="left"></div>
    <div id="right"></div>
</div>

CSS:

*{margin:0;padding:0;}
html,body{ height:100%;}
#wrap{ width:80%;overflow:hidden; margin:0 auto; height:100%; background:#CCC;}
#main{ float:left; width:100%; height:100%;}
#body{ margin:0 210px; background:#069; height:100%;}
#left,#right{ float:left; width:200px; height:100%;}
#left{ background:#939; margin-left:-100%;filter:;}
#right{ background:#CC9; margin-left:-200px; }

　　注意倒数第二个CSS规则（即倒数第一个#left），用了一个空的filter完美解决了IE6下margin-left:-100%计算不正确。不知道诡异的IE6是怎么计算这个百分比负margin的，我用过pixelLeft方法试图把这-100%转化成绝对值，输出的结果跟出现在屏幕上的位置不相符。猜想IE 6下margin的计算和left的计算不是用一个参照box。偶然用opacity时，发现在IE6下神奇的将上面的问题给解决了，经过测试发现只要有一个filter申明就能解决此问题，无论值为何。

　　有知道本源的侠士，还望不吝相告。：）

转载于:https://www.cnblogs.com/onlysea/archive/2011/09/25/2190410.html