日期:2014-05-17  浏览次数:20662 次

float在ie和firefox中显示不同。。
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 特性