Safari

Question

在Chrome和Firefox中，flexboxs可以扩展以容纳其中的文本，但我无法让Safari反映此行为。

当使窗口变窄时，柔性盒变得更窄，因此文本更接近于溢出的Flexbox。 Chrome和Firefox上出现的所需行为是，如果其中的文本不适合，则会使flexboxes换行，但在Safari中，flexbox会不断缩小，文本会从flexbox中泄漏出来。如何防止盒子在Safari中缩小到文本内部的缩小范围？

CSS：

.flexbox {
  display: -webkit-flex;
  display: -webkit-box;
  display: flex;
  width: 30%;
  border: 2px solid black;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.a > div {
  background-color: pink;
  -webkit-flex-grow: 1;
          flex-grow: 1;
  -webkit-flex-basis: 30%;
          flex-basis: 30%;
  -webkit-flex-shrink: 0;
          flex-shrink: 0;
  -webkit-flex-basis: calc((100% / 3) - 30px);
          flex-basis: calc((100% / 3) - 30px);
    margin: 5px;
}

示范：https://jsfiddle.net/h6aydfxr/

调整浏览器大小以调整框大小。