html - 一个元素的正常流动

Question

是否可以只为一个元素添加正常流？这是我的麻烦:

html:

<div class="block pink float"></div>
<div class="block blue float clear"></div>
<div class="block green float"></div>

CSS:

.block {
   width: 200px;
   height: 200px;
}
.clear { clear: left; }
.float { float: left; }
.pink { background: #ee3e64; }
.blue { background: #44accf;}
.green { background: #b7d84b; height: 400px;}

http://jsfiddle.net/E2uLk/

我需要我的绿色 block 从粉色 block 开始 float (在文档的顶部和粉色的右边)。我无法更改 html 结构或添加任何额外的包装器。您可以在 Internet Explorer 7 中看到的预期结果 :)(由于某些 ie 错误，但我需要在所有现代浏览器中使用相同的错误)。非常感谢。

Answer 1

这是一个简洁的方法:http://jsfiddle.net/E2uLk/5/

你漂浮着粉色和蓝色。
你用蓝色清除 float 。
您从粉红色和蓝色的宽度偏移了绿色。

.pink  { background: #ee3e64; float: left; }
.blue  { background: #44accf; float: left; clear: both; }
.green { background: #b7d84b; height: 400px; margin-left: 200px; }