Css 在定位上规避webkit缺陷<；李>；浮动元素后的项目符号错误_Css_Webkit_Css Float_Position

Css 在定位上规避webkit缺陷<；李>；浮动元素后的项目符号错误

css

Css 在定位上规避webkit缺陷<；李>；浮动元素后的项目符号错误,css,webkit,css-float,position,Css,Webkit,Css Float,Position,存在一个导致浏览器（Safari、Chrome，…）将第一个的项目符号或编号放置在右侧，如果它前面有一个浮动元素。下面是一个简单的问题示例： <!DOCTYPE html> <html> <head> </head> <body style="width:250px"> <div style="width: 100%; float: left;"> List with bullet at the

存在一个导致浏览器（Safari、Chrome，…）将第一个

的项目符号或编号放置在右侧，如果它前面有一个浮动元素。下面是一个简单的问题示例：

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body style="width:250px">
    <div style="width: 100%; float: left;">
    List with bullet at the wrong side:
    </div>
    <div>
      <ul>
        <li>bullet ends up here -></li>
      </ul>
    </div>
  </body>
</html>


列表中的项目符号位于错误的一侧：

子弹在这里结束->

由于已报告，在某一点上可能会有轻微的修复机会

同时，我如何仅通过修改现有DIV:s的样式（即不修改结构）来避免该问题？

使用

溢出：隐藏

当然，这还有隐藏溢出带来的其他副作用，例如不能将元素移动到边界框之外，否则它们将被切断。
在Chrome 22.0.1229.2 dev mSorry上，在测试时，我意外粘贴了一个没有暴露问题的版本。现在已更正。WebKit-r125261（撰写本文时的最新版本）中没有修复此问题。它与“clear:left”（实际上是在错误报告中建议的；-）之间的区别是什么？没有理由脸红；）我们是来互相学习的，不是吗？clear:left
将实际清除浮动并在浮动元素下显示已清除的元素。overflow
属性只会使内容包装到其边界框中。但它仍然漂浮在另一个元素旁边。