如何设置flex容器采用其内容的宽度？

Question

我希望Flex容器能够扩展以收缩以适合项目。 在此示例中，您可以看到flex-container的宽度为灰色。我想做的是摆脱右边距。

我找到了一些解决方案，这些解决方案对我不起作用，但可能对其他人有用。

在弹性容器上使用justify-content: space-between;或justify-content: space-around;沿主轴使弹性项居中。但是，如果每行有不同数量的弹性项目，则会破坏列的结构。

在弹性项目上使用flex-grow: 1;会使它们扩展以占用容器的宽度。但是，如果每行有不同数量的flex-items，所有这些都会破坏列的结构。

Here a code snippet

How to get Flex container to fit content

将float:left;和display: inline-flex;都没有应用于flex-container并没有做任何事情。

How do i set a flex-container to be the width of its flex-items?