web标准化：闭合浮动元素超级简单的方法

外围元素之所以不能很好的延伸，问题出在了overflow上，因为overflow不可见，见W3C的解释。现在只要将给外围元素添加一个overflow:auto;就可以解决问题，结果是除了IE，真的可以解决。下来就要解决ie的问题了，再加上_height:1%; ，这个问题就完全解决了。

下面是我做的三个例子作为比较

1.没有闭合浮动元素

2.非IE下闭合浮动元素

3.完全闭合元素

代码如下：

XHTML<div id=”wrap”>

<div class=”column_left”>

<h1>Float left</h1>

</div>

<div class=”column_right”>

<h1>Float right</h1>

</div>

</div>

CSS样式：

#wrap{ border:6px #ccc solid; overflow:auto; _height:1%;}

.column_left{ float:left; width:20%; padding:10px;}

.column_right{ float:right; width:75%; padding:10px; border-left:6px #eee solid;}