包裹后，flexbox容器可以收缩吗？

Question

这是2个flexbox布局的简单示例；一包，其他不包。

如您所见，第一个示例没有。我应用的flexbox参数使它缩小以适合其内容。

第二个自动换行，但没有缩小到最小的尺寸，而是缩小到我设置的最大宽度。

通常，这意味着结尾处有些多余的东西。但是，由于我要滚动到该空间，因此需要准确无误。

关于如何解决此问题的任何想法？

* {
  box-sizing: border-box;
}

.container {
  display: flex;
  background-color: lime;
  padding: 8px;
}

.flexbox {
  background-color:red;
  flex: 0 0 auto;
  display: inline-flex;
  max-width: 420px;
}

.flexbox-wrap {
  flex-wrap: wrap;
}

.child {
  background-color: aqua;
  flex: 0 0 auto;
  display: inline-flex;
  line-height: 32px;
  margin-top: 8px;
  padding: 0 12px;
}

<div class="container">
  <div class="flexbox">
    <div class="child">child</div>
    <div class="child">other child</div>
    <div class="child">child</div>
  </div>
</div>

<div class="container">
  <div class="flexbox flexbox-wrap">
    <div class="child">child</div>
    <div class="child">other child</div>
    <div class="child">child</div>
    <div class="child">child</div>
    <div class="child">other child</div>
    <div class="child">child 3</div>
    <div class="child">child</div>
    <div class="child">child</div>
    <div class="child">child</div>
    <div class="child">other child</div>
    <div class="child">child 3</div>
    <div class="child">child</div>
    <div class="child">child</div>
    <div class="child">child</div>
  </div>
</div>