css布局：IE下浮動(float)bug

　　今天在做力發精鑄這個網站的網時，用css布發現float後在IE下和Firefox下面的結果不一樣，代碼大緻如下：

<div style="width:960px;margin:0 auto;padding:20px;">

<div style="float:left; width:200px; background-color:red">left</div>

<div style="flaot:right; width:500px;background-color:blue">right</div>

<br style="clear:both;" />

<div>底部</div>

</div>

　　 這段代碼在IE下會底部有很大空白，而Firefox下卻是正常顯示，Firefox更符合我想要的結果，也是正常的布局結果，而IE則讓人有感覺有點莫名，其實這就是IE的bug。

既 然發現問題，就得解決問題，不然看着很不舒服，經過排查，我把原因鎖定在了<div style="width:960px;margin:0 auto;padding:20px;">這句上，把padding:20px;去掉後，結果顯示正常，padding可用margin變相代替。 至此，問題圓滿解決。

　　希望遇到此問題的朋友，能看到，節省大家寶貴的時間。