为什么我在Chrome中使用UL后看到额外的空间

Question

运行Windows 7,Chrome版本53.0.2785.116 m

似乎在项目符号和项目的第一个字符之间的ul列表中添加了巨大的差距.我正在使用list-style-position:inside; 这似乎是添加空间(我不是指整个线的位置进一步 - 只是子弹和第一个角色之间的空间.)

一个简单的HTML5骨架,没有其他CSS示例会显示:

<ul>
	<li style="list-style-position: inside;">One</li>
	<li>Two</li>
	<li>Three</li>
</ul>

将第一行中的空间与其他两行进行比较.

为什么？!这是微软Internet Explorer的一个糟糕的设计"功能",我当然希望谷歌不会模仿它.差距似乎比IE更大.所以现在我在Chrome中查看页面时会收到额外的(和不必要的)换行符.这意味着可以将更少的内容放入固定的宽度/高度设计中.或者更小的字体来补偿等.

子弹只需要它与内容之间的一个空格; 作为列表中的文本和列表中的每个项目之间的空格.

其他人看到这个？(这必须是最新的,因为上周我更新页面时不是问题)

Answer 1

与此同时，我可能会建议以下解决方法：

li:before {
    content: "\a0";
    display: inline-block;
    width: 0;
    margin-left: -.5em;
    margin-right: -.5em;
}

例如：

希望您能够提出一个适当的选择器，该选择器将针对所有相关的<ul>选择器，并且不需要更改 HTML 标记。