- HTML code
<html> <head> <style type="text/css"> li { border-right:1px solid #000; float:left; height:20px; padding-right:100px; background:#FFF; margin-bottom:1px; } </style> </head><body> <ul> <li style="clear:both">float01</li> <li>float02</li> <li>float03</li> <li style="clear:both">float04</li> <li style="float:right">float05</li> <li style="clear:right">float06</li> <li>float07</li> <li>float08</li> <li style="clear:left">float09</li> <li>float10</li> <li>float11</li> <li>float12</li> </ul> </body></html>
在ie中
在firefox中
请问这个问题是什么引起的,说明一下ie和firefox里面float和clear的原理好么?怎么解决?谢谢啦.
------解决方案--------------------------------------------------------
clear和float的原理,lz最好看看这几个帖子:
【分享】说说标准——CSS核心可视化格式模型(visual formatting model)之七:浮动(Float)概述
【分享】说说标准——CSS核心可视化格式模型(visual formatting model)之八:float 特性以及浮动(Float)定位细则一
【分享】说说标准——CSS核心可视化格式模型(visual formatting model)之九:浮动(Float)定位细则二
【分享】说说标准——CSS核心可视化格式模型(visual formatting model)之十:控制紧接浮动的排列-clear 特性