css - Chrome 53 在 LI 元素中引入了不需要的间距

Question

从 Chrome 53 开始，我们注意到一个与 CSS 相关的新问题。

此问题也可以在 Vivaldi(基于与 Chrome 相同的引擎)中看到。在 Safari 或 Firefox 或 Chrome 52 中未发现同样的问题。

例如，此处:https://mobilefirstplatform.ibmcloud.com/tutorials/en/foundation/8.0/using-the-mfpf-sdk/

这是需要更新我们的 CSS 的规范更改还是渲染引擎中的实际错误？

更新:这似乎是因为 list-style-position:inside 而发生的。

<ul style="list-style-position:inside">
    <li>li element 1</li>
    <li>li element 2</li>
</ul>

使用时，除了 LI 元素按预期插入内部之外，元素符号和文本之间的间距也会增加。删除 CSS 规则，元素符号和文本之间的间距要小得多。

我们如何解决这个问题？

Answer 1

不能说这是一个怪癖还是规范更改，但解决方法是将列表样式设置为外部，而不是使用左边距填充:

.tutorial .sidebar .navmenu-default .navmenu-nav.dropdown-menu>li.active>ul>li {
      list-style-position: outside;
}
.tutorial .sidebar ul {
    margin-left: 10px;
    padding: 0;
}