css总结之float、clear

解释
float:none|left|right none为默认值
指定对象浮动的位子
clear:none|left|right|both  none为默认值
清除浮动的对象的边

如果用浮动,就一定要在用完的时候清除浮动

引入clear后IE和FF的高度变化解决方法
加入<div class="clear"></div>后引起IE和FF高度变化，通过如下方法解决：
.clear{
    clear:both;
    height:1px;
    margin-top:-1px;
    overflow:hidden;
}

一些浮动的问题及解决
1、推倒：突破伸出主内容之外把侧栏推到下面。解决：确保不是图片造成这种情况，使用 overflow:hidden 来切除多余的部分
2、双倍边距bug处理 IE6 时，另一个需要记住的事情是，如果在和浮动方向相同的方向上设置外边距(margin)，会引发双倍边距。快速修正：给浮动设置 display:inline; 而且不用担心，它依然是块级元素。
3、3像素间距是指挨着浮动元素的文本会神奇的被踢出去3像素，好像浮动元素的周围有一个奇怪的力场一样。快速修正：在受影响的文本上设置宽度或高度
4、IE7 中，底边距 bug是当浮动父元素有浮动子元素时，这些子元素的底边距会被父元素忽略掉。快速修正：用父元素的底内补白(padding)代替。