Chrome 53 在 LI 元素中引入了不需要的间距
Chrome 53 introduces unwanted spacing in LI elements
开始 Chrome 53 我们注意到一个新的 CSS-related 问题。
这个问题也可以在 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 规则,项目符号和文本之间的间距更小。
我们如何解决这个问题?
不能说这是一个怪癖还是规范更改,但解决方法是将列表样式设置为外部,而不是使用左边距填充:
.tutorial .sidebar .navmenu-default .navmenu-nav.dropdown-menu>li.active>ul>li {
list-style-position: outside;
}
.tutorial .sidebar ul {
margin-left: 10px;
padding: 0;
}
开始 Chrome 53 我们注意到一个新的 CSS-related 问题。
这个问题也可以在 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 规则,项目符号和文本之间的间距更小。
我们如何解决这个问题?
不能说这是一个怪癖还是规范更改,但解决方法是将列表样式设置为外部,而不是使用左边距填充:
.tutorial .sidebar .navmenu-default .navmenu-nav.dropdown-menu>li.active>ul>li {
list-style-position: outside;
}
.tutorial .sidebar ul {
margin-left: 10px;
padding: 0;
}