零宽度非连接器（）在IE7中显示为管道

Question

我绝望地试图在列表元素中添加一些空格（下面的简化版本）

<ul>
  <li>&zwnj;&#160;&#160;A1</li>
  <li>&zwnj;&#160;&#160;&#160;&#160;A1.1</li>
  ...
</ul>

我的问题是，IE7忽略了空格，所以我添加了零宽度非连接符（‌）。这是下一个问题。 IE7将‌渲染为管道（vertikal bar）。

任何提示我如何解决这个问题？我的目标是用空格（或其他）来打算列表元素。

强尼

Answer 1

从技术上讲，IE 7显示“管道”的原因在于它表明了一个不可代表的字符。 IE 7不知道ZWNJ是一个控制字符，并试图在字体中找到它，这对于大多数字体都是失败的。您可以通过将字体设置为包含ZWNJ的字体来避免这种情况，例如

li { font-family: "Arial Unicode MS", "Lucida Sans Unicode" }

这当然会影响字体，但您可以将ZWNJ字符包装在span元素中，并仅在它们上设置样式。

然而，这似乎是一种完全错误的方法。 ZWNJ可以防止结扎行为，这里根本不需要。 IE无论如何都将不间断空格视为不可折叠（正如您可以通过单独测试代码看到的那样）。如果没有，那么还会发生其他事情，这些内容无法从您发布的代码中看到。

Answer 2

用空格缩进是一个坏主意。请改用CSS margin-left。