如何将全宽度设置为多行动态浮动元素

Question

我有一个容器，它具有可变数量的子元素，这些子元素是动态创建的，它们需要彼此相邻并适合其父项的整个宽度。这听起来很简单，但我无法让孩子占据容器的整个宽度。

这是一个更直观的例子：

用例1：完美宽度场景

ppppppppppppppppppppppppppppppppppppppppp
c1111 c222222222 c333 c4444444444 c555555
ppppppppppppppppppppppppppppppppppppppppp

用例2：添加了新的子项，其中一些现在具有不同的宽度

ppppppppppppppppppppppppppppppppppppppppp
c1111 c222222 c333 c4444444444
c55555555555555 c6666
ppppppppppppppppppppppppppppppppppppppppp

我希望调整余下的空间。我到目前为止的方式是做这样的事情：

.p {
    display: table;
}
.c {
    float: left;
    width: auto;
}

期望的行为：

ppppppppppppppppppppppppppppppppppppppppp
c1111 c222222 c333 c4444444444(444444444)
c55555555555555 c6666(666666666666666666)
ppppppppppppppppppppppppppppppppppppppppp

注意每行（parens）中最后一个孩子是如何填充额外空间的。这可以用纯CSS吗？

谢谢！