端午节放假三天，终于可以喘一下气了。今早弄了一个“励志人生”，主要是一些励志英语名句，而且是随机显示一句的。每次登录一次就读一次，读多了就会记住了，对写作对阅读都有利于。其实这个想法在很久以前就有了，但是一直没有时间弄。
今早起床后，在网上找了很久都找不到合适的随机公告代码，最后还是在自己的电脑上找到了一个比较有用的代码，稍改一下就可以用了。有TheWorld下测试没有任何问题。显示很perfect。虽然是JS调用的，但一点都不会卡，实在太高兴了。之后有事就出去一会。
回来一看博客，发现bombee给我留言，他说在Firefox下不能很好显示。这才提醒了我，自从换了系统以后，一直用TheWorld，Firefox都忘记装了。于是马上Google一下，发现Firefox 3.0 rc2版本前两天已经发布。对于Firefox速度的崇拜，于是马上下载下来。虽然看上去跟Firefox 3.0 rc1没有什么差别，但速度决对比Firefox 3.0 rc1快很多。我还真想不到，在我们这样乌龟爬的校园网里还能有这样快速的冲浪享受。（等有空再详细说说Firefox吧。） 不过打开我的博客后，就知道痛苦了。
我发现移植“生命之绿”这个主题的时候忘记在Firefox下测试，所以出现主背景不显示，以及标题错位，还有就是“励志人生”那一块跟标题混排。看上去，千疮百孔，满目苍夷，非常的难看。
于是马上动手，把CSS代码一个个找出来，然后边修改边测试。终于经过两个多小时，终于把这错位的问题摆平了。原来关系最大的就一个“clear”属性。
CSS手册上是这样说明的：该属性的值指出了不允许有浮动对象的边。这个属性是用来控制float属性在文档流的物理位置的。
当属性设置float（浮动）时，其所在的物理位置已经脱离文档流了，但是大多时候我们希望文档流能识别float（浮动），或者是希望float（浮动）后面的元素不被float（浮动）所影响，这个时候我们就需要用clear:both;来清除。
比如：
<p style="float:left;width:200px;">迷走第1行</p>
<p style="float:left;width:400px;">迷走第2行</p>
<p>迷走333</p>
如果不用清除浮动，那么“迷走333”就会和第1、2行文字在一起 ，所以我们在第3个这列加一个清除浮动 clear:both;
<p style="float:left;width:200px;">迷走第1行</p>
<p style="float:left;width:400px;">迷走第2行</p>
<p style="clear:both;">迷走333</p>
由此可见，clear: both主要是用在div套div的结构中，如果内div是浮动的，一般都需要clear浮动，不然内div会超出外div的框架而产生混排现象。
其实，Firefox、IE6以及IE7在CSS的兼容还有许许多多的问题，所以我在创作主题或是移植主题的时候，都不要忘记把CSS在Firefox、IE6以及IE7这两大流浏览器中作测试。如果有朋友对CSS还不了解的话，可以看一下《CSS设计彻底研究》这方面的视频。