如何使用CSS防止列表项中的换行符

Question

我试图放置一个名为的链接使用li标记在菜单中提交简历。由于两个单词之间的空格，它会包装成两行。如何防止用CSS包装？

Answer 1

使用white-space: nowrap;¹，或给该链接由li的宽度设置为更大的值的更多的空间。

Answer 2

如果你想选择实现这一目标（即：只对特定的链接），你可以使用非打破空间，而不是一个正常的空间：

<li>submit&nbsp;resume</li> 

http://en.wikipedia.org/wiki/Wikipedia:Line-break_handling#.26nbsp.3B

编辑：我知道这是HTML，而不是OP所要求的CSS，但有些人可能会发现它很有用...

Answer 3

您可以添加这段小小的代码，在行尾添加一个不错的“...”如果内容我s以大到适合一条线：

li { 
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
} 

Answer 4

display：inline-block;将阻止换行列表项

http://jsfiddle.net/Nash171/mwe4s0nc/46/

li{ 
    display: inline-block; 
}