【分享】浮动元素上 clear 特性的兼容性问题
这个问题
http://topic.csdn.net/u/20100823/17/b8751ffb-8e4d-46f1-a0af-2ab0798b2fc2.html
规则这样说
在 说说标准系列的clear那一帖中，最后说到了浮动元素上的 clear 特性会影响浮动的规则。
新增规则：
浮动框区的上外边界（top margin edge）必须低于前面所有左浮框的下外边界（在clear:left时），或者右浮框区（clear:right），或者两个框区(clear:both)。
详见：http://topic.csdn.net/u/20100820/17/9cd6010f-c903-43a7-83c7-4c74d7fc290e.html?03208088875356182
而在举例的时候，我们也看到了IE让人无奈的一面。新的规则，旧版本的IE不支持。
那么，到底在IE中，浮动元素上的 clear 是怎样被处理的呢？带着这个问题，让我们开始今天的内容。
含有clear特性的浮动元素对自身定位的影响
例：
<div style="border:1px solid green; width:150px; float:left;"> <div id="Float" style="float:right; width:100px; height:100px; background-color: blue;">Float</div> <div id="Clear" style="clear:right; float:left; width:100px; height:100px; background-color:red;filter:alpha(opacity=50);-moz-opacity:0.5; opacity: 0.5;">Clear</div></div>
<div id="Container" style="width:300px; height:200px; border:1px solid red;"> <div id="DIV1" style="float:right; width:150px; height: 50px; background-color:blue;">1 float:right;</div> <div id="DIV2" style="clear:right; float:right; width:250px; height: 50px; background-color:red;">2 clear:right; float:right; </div> <div id="DIV3" style="float:left; width:100px; height: 50px; background-color:green;">3 float:left;</div></div>
