使用“向左浮动”的框进行Flex wrap布局-使最后一行框的宽度与其余行相同

Question

我有一个带框的布局。框数是动态的，具体取决于我从服务器检索的JSON。这些框需要排成一排，并且必须充分显示框内的所有内容，但是，框数最大的行不能有任何间隙。

我已经通过在父级上使用flex-wrap: wrap在框上使用flex: 1来实现这一目标。

但是，如果最后一行没有其他盒子那么多，则它们不应该一直伸展到父对象的宽度。

如前所述-具有最大数量的框的行不应留有任何间隙，而应占用整个剩余空间

这甚至可能吗？如果是的话，该怎么办？

以下是显示问题的小提琴：https://jsfiddle.net/ymcwnbo2/1/

Answer 1

将以下内容添加到容器中

justify-content: flex-start

并从框中删除flex：1

选中此https://jsfiddle.net/ymcwnbo2/