css - 浮动和列表样式位置：在内部，不能在最新的 chrome 中工作？

Question

我刚收到一位客户的电子邮件，他网站上的一些列表元素一夜之间坏了？在过去的几个月里，我没有更改任何代码，当我尝试这个简单的代码时：Firefox 和 IE 确实尊重 list-style-position: inside; 在浮动列表元素上，但现在 Chrome 没有？！有解决办法吗？这是一个错误还是一个新标准？(HTML5 DTD)

我的小提琴

<style>    
ul {
    list-style-position: inside;
    width:150px;
}

li {
    background:#c9c9c9;
    float:left;
    clear:both;
}
</style>


<div class="wrapper">
    <ul>
        <li><a href="#">Product1</a></li>
        <li><a href="#">Product2</a></li>
    </ul>
    <div class="clear"></div>
</div>

Answer 1

是的，这是一个错误。检查这个页面。

Answer 2

这似乎是 Chrome 中的一个错误。您可以尝试使用以下代码来达到目的

ul li{
margin-left:1em;
}

Answer 3

.clear{clear:both;}
li {
    background:#c9c9c9;
    clear:both;
    list-style-position: inside;
}
ul {
    width:150px;
}

在你的jsfiddle中检查这个