html – 限制文本换行的CSS方式

我可能有点奇怪的任务,但我相信没有更好的解决方案.我需要< ul>在一些容器中,其宽度是可变的并且具有内联的< li>固定宽度的元素.我应该(并且已经找到解决方案)在< li>之间放置空格相同宽度的元素.空间宽度是动态变化,取决于父容器宽度.同样,这个< li>物品有固定的宽度.

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

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

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

但是,正如您可能猜到的那样,文本分为两行,实际上是列表项的底部,而不是右侧.

我想要的效果可以通过插入& nbsp;来完成.在这样的文字中插入空格：< li>< a href =“#”>添加& nbsp;到& nbsp;收藏夹< / a>< / li> .

所以,我的问题是：如何以css方式使通常的文字不要分成几行？

.nobr  { white-space:nowrap; }