避免不必要的float

float中文翻译为浮动，很形象的翻译，在CSS很常用，当你需要吧两个块级元素定排放在同一高度上经常会用到float，先看一下float的 属性。

先看一下float可能的值：

float:left-元素向左浮动

float:right-元素向右浮动

float:none-不浮动

float:inherit-从父类的float属性继承

既然说道浮动，那么就有必要提一下浮动的清理，因为如果一个元素的float一旦被设定后将影响其左右的元素。当我们不需要浮动时应该即时清理。清 理浮动使用clear。clear的属性和float相当，只是多了一个属性

clear:left/right/inherit/none (清理浮动、不浮动、以及继承清理的属性)

clear:both-清理所有浮动

上面，简单的对浮动与清理浮动做了一个解释，浮动在实际应用种是非常广泛的，但也有很多地方不应该使用float，或者我们有更好的方法来解决。看 那些地方我们有更好的办法来解决。

1、无序链接，经常可以看到一些网站的关键字链接，或者产品关键字，已经分类等部分会用到比 较短的链接混乱排列，有些人使用<ul><li>配合float来做链接，我想这个是完全没有必要的，你可以设 定<li>标签的display:inline，吧<li>设定为线级元素来达到混排的效果，不需要使用float。甚至这样的 链接完全可以由<p><a>这样的标签来代替，岂不是更简洁？

2、我们在做一个区块的时候经常使要用more（更多）来链接相关的页面，这样的标题栏往往左边是标题，右边为more链接，很多人喜欢用 float来做，这样在float之后还要多一个标签来clear，感觉很繁琐，甚至更有人用整张图片配合热点来做，我觉的这些都不是很好的办法。其实像 这种效果完全可以用定位来做，设定title的position:relative。然后定义more这个标签的right:0或者不需要那么右，你可以 详细设定它的位置。这样省去了float以及clear，结构也更清晰了。

3、多列不规则布局，我们经常要用到3列布局，这种布局由于规则，但是为了美观，我们必须定义3列的总宽度，但是根据CSS中浮动的总宽必 须<99%的父标签宽度，否则经常会在某些浏览器下面出错，但是99%的宽在宽屏显示器下面很明显会出现10px以上的错位，所以这是一个很郁闷的 问题，其实在碰到这类问题时我们应该有限使用position定位来解决问题，而不是浮动，这个问题在这里就不多说了，下面会有一篇关于定位的详细文章。

总结一下，CSS下面的浮动，虽然很是常用，但是我们要坚持几条原则，能有更好的解决办法(display,position)的时候我们坚决使用 float，同一高度的浮动总宽度（包括margin,padding）应该小于等于（<）父元素的宽度，记住是小于，而不是等于，如果是等于可能 你会在别的浏览器上看到你不想看到的结果。