如何让孩子UL来到父母UL之外

Question

标题中解释的行为问题是可以理解的，但我需要一种解决方法。

我在JSfiddle中做了一个例子：http://jsfiddle.net/TBXr4/2/

在第一个LI中看到我有几个字。他们没有像我需要的那样排队，但他们正在上市。我该如何解决这个问题？

让我更具体一点，我不想手动设置子UL的宽度，实际上我不希望设置一个。我需要一种方法，即父UL将设置宽度，而子UL将是继承文本的最小可能宽度。

Answer 1

您只需设置white-space元素的li属性：

li {
    /* other stuff */
    white-space: nowrap;
}

JS Fiddle demo

问题在于，虽然文本在父ul指定的宽度之外可见，但li的样式（background-color / {{1} }）不会结转。

参考文献：

• CSS white-space property。

Answer 2

<强> Demo is here

我认为你只想要这个。

Answer 3

文本未在一行上显示句子的原因是因为您设置了li的宽度，请删除style="width:35px"。

Answer 4

为什么要指定您不希望遵守的确切元素（UL）的宽度？

将宽度设置应用于主列表，并为子列表指定新宽度，如this jsfiddle example

所示