CSS限制文本换行符的方法

Question

我可能有一点奇怪的任务，但我相信没有更好的解决方案了。我需要在一些容器中的<ul>，它的宽度是可变的，并与固定宽度的内联<li>元素。我应该(并且已经找到了解决方案)在相同宽度的<li>元素之间放置空格。间隔的宽度是动态变化的，并且依赖于双亲容器的宽度。同样，此<li>项具有固定的宽度。

我还应该将一些链接放在这些描述的元素之上。由于某些原因，链接必须在其他<ul>元素中。它们还封装在内联的<li>元素中。我希望它们位于所描述的<li>项目的正上方。这可以通过如上所述设置<li>项的固定宽度来完成。现在，问题是每个链接中的文本实际上都有不同的宽度，并且会被分成两行，但我必须把它放在一行中。

所以我想欺骗浏览器:文本将溢出<li>项目。

.liElem {
  width: 100px;
  height: 20px;
  overflow: visible;
}

但是，正如您可能猜到的，文本被分成两行，实际上溢出的是列表项的底部，而不是右侧。

我想要的效果可以通过在文本中插入 实例来实现，比如：<li><a href="#">Add&nbsp;to&nbsp;Favourites</a></li>。

所以，我的问题是:在css-way中，如何使通常的文本不会被分成几行？

Answer 1

.nobr  { white-space:nowrap; }