Css 为什么内联块列表项显示在两行上？文本中包含一个数字（哪个不重要？）

到底是什么原因导致5号线在第二条线上向下移动？其他列表项有更多的字符，我甚至在“Foo Fighters”中添加了一个数字，只是为了看看它是否是由int字符引起的，而int字符应该显示出来

<ul id="soundsLike">
    <li>Foo Fighters</li>
    <li>Maroon 5</li>
    <li>Paramore</li>
    <li>Jimmy Eat World</li>
    <li>none of these</li>
</ul>

---

这段代码本身没有这个问题（请参阅：），所以一定有其他因素影响它

---

但是有一件事应该防止这种情况发生，那就是把

放在空白处：nowrap到“li一样的声音”风格。
你能给我们展示一下吗？可能是JSFIDLE？是的，请至少提供更多CSS。我没有你提到的代码问题。对不起，这是一个巨大的CSS文件。问题来自于正文的这种风格
文本呈现：优化易读性是否有固定宽度的包装元素？这可能会产生视觉效果，即使使用
文本呈现：优化易读性应用
空白：nowrap修复了它。谢谢
#soundsLike {
    list-style: none;
    margin:0px;
    padding:0px;
}
#soundsLike li {
    display: inline-block;
    padding:3px 5px;
    background:#57A957;
    text-align: center;
    color:#000;
    font-size:80%;
    line-height:14px;
}