如何使Wrapper div只包含非溢出div

Question

我有一个div包含带内容的div。 外部div具有动态宽度（例如80％）。 内部div具有固定宽度（例如100px）。

问题在于我只想显示那么多内部div，以便没有内部div“溢出”/“被切断”，如图1所示。

我还希望“分配”“自由”空间作为内部div之间平均分布的边距，如图2所示。

我希望有人理解我的问题，并且知道如何用css和尽可能少的javascript实现这一点：）

P.S。：如果这很容易，那么第一个和最后一个div是否可以有最大值。边界的边缘？

Answer 1

在您使用更多信息修改问题之前已开始使用此功能，但我相信您之后缺少的部分是＆＃39;外部＆＃39;中的text-align: justify。

.outer{
    background: red;
    width: 80%;
    overflow: hidden;
    height: 48px;
    text-align: justify;
}

.inner{
    background: blue;
    width: 100px;
    height: 40px;
    margin: 4px;
    display: inline-block;
}​

Here's a fiddle.

不完全确定你的最大边距是什么意思，但听起来可以通过给左边和右边的容器一个固定的填充来实现。