防止CSS布局中的换行

hek*_*ran 24 css frontend

我的CSS设计师做了一个设计,其中有两个ul兄弟姐妹从左到右排列.通过指定ul标签的宽度来完成布局.

他在Windows上使用Firefox,一切都很好.我在OS X上使用Firefox,其中一个li标签的内容有太多的文本,所以它流向另一行.设计的目的是将文本放在一行上.

有几点需要考虑:

  • 我希望ul标签从左到右,而不是从上到下
  • 我希望解决方案是i18n友好的(翻译字符串不应该导致它们分成两行)

如果这是以像素定义的,那么即使在同一个浏览器中,与Windows相比,它在OS X中的显示方式也不同?

是否有一般的CSS解决方案可以防止包装线或防止页面在OS X和Windows之间的换行方面看起来不同?或者这是一个失败的原因?

Ale*_*hev 49

white-space: nowrapuls 上设置将阻止文本包装,直到<br />找到它为止.根据我的理解,列表已经是水平的,但为了完整起见,你可以通过制作li元素display: inlinedisplay: inline-block.该white-space: nowrap不会为工作的float编辑列表项.

参考文献: