CSS“display：inline-block”拒绝断行

Question

我正在开发一个项目，我正在尝试设置特定链接类型的样式，就像Adi Palaz使用here定义外部链接一样。我的代码设置与他的相同，但由于某种原因，display: inline-block溢出了包含<li>元素（具有已定义的宽度），因此列表元素并排堆叠。 / p>

有人可以告诉我如何在这个演示开发页面（http://dreamstarstudios.net/sandbox/philosimply/sliding_drawer.html）底部强制链接“The Mountain and the Mole Hill”来打破线条吗？我认为inline-block明确是为了让文本显示为块级元素但仍然会打破行。更奇怪的是，将它更改为display: inline不会强制换行，而只会导致文本溢出定义的宽度:(

编辑我很抱歉没有进一步解释。如果您查看此链接（http://www.adipalaz.com/linksbg.html），您将看到此开发人员如何使用white-space: nowrap（这是必需的）来实现我想要的效果。我真正需要知道的是为什么它适合他而不是我。

Answer 1

只需删除white-space:nowrap;

即可

http://www.w3schools.com/cssref/pr_text_white-space.asp

Answer 2

在您的样式表'第206行'中设置宽度，它正在按照您的要求进行操作，您需要将其扩大或将clear: both;添加到li

Answer 3

您已在此链接上设置white-space:nowrap。这就是为什么它不会破裂。