html - 如何避免div换行显示

Question

我在同一行显示了一个 div 列表。当页面宽度不足以在同一行显示所有div时，我不想在下一行显示额外的div。如何避免在新行上显示额外的 div？

这是一个 jsFiddle:http://jsfiddle.net/YCFZM/

尝试减小页面宽度，您会看到一些 div 显示在新行上。

谢谢。

Answer 1

更新要点和解决方案:http://jsfiddle.net/Meligy/YCFZM/16/

主要变化:

• 在 id=""sidebar" 处删除了 HTML 中的额外引号，这打破了要点
• 从 div#sidebar CSS 中移除了 height: 0px;
• 添加 white-space:nowrap; 到 div#sidebar CSS
• 从 div.sidebar-item CSS 中移除了 float:left
• 添加了 white-space: nowrap; display:inline-block; 到 div.sidebar-item CSS

如果您想让文本位于左侧，您还可以选择从 div#sidebar CSS 中删除 text-align:center;。