css - 无限宽度的宽 div

Question

我有一个大问题!

您知道，div 默认的 width 是 100%(父级的)。如果内容宽度大于 100% (100%=1440px)，div 会以多行显示内容。

现在，如果我想让 div 在一行中显示它的内容，我应该怎么做？看看简单的代码::

<div>
    <div>aaa</div>
    <div>bbb</div>
    <div>ccc</div>
    <div>ddd</div>
    ......(more than 100 other div, with unknown width)
</div>

注意:我不知道内容宽度。

我尝试了 display: inline; 和 display: inline-block; 和 display: table;。他们没有工作。

注意 2:我试过 display: -moz-box;。它可以工作，但只能在 FIREFOX 中使用! 谢谢...

Answer 1

最简单的方法是使用white-space: nowrap在父级上，display: inline-block 在子级上:

参见: http://jsfiddle.net/4Yv83/

我还添加了 overflow-x: auto，因为大概是你 don't want this .