0
SafariのブレークポイントでFlexboxタイルをスタックするのに問題がある（この商品についてはv10.0）。ここに、私がしようとしていることを示すcodepenの例があります。フレックスボックスがサファリに積み重なっていない
このトピックには既にかなりのQ/Aがありますが、私はまだ特定の問題を解決する解決策を見つける必要があります。ベンダープレフィックス&はベンダープレフィックスなしでテストしました。 calc（）とmin-widthプロパティを削除してください！それは別のものですか？ここで私は何をしようとしているのJIST ...
.tile-container
display: flex
flex-wrap: wrap
.tile
flex: 1
margin: 3px
padding: 2rem
min-width: calc(25% - 0.75rem)
min-height: 200px
text-align: center
color: #fff
background: tomato
.tile-icon
width: 100%
max-width: 50px
.tile-title
display: block
padding-top: 10px
.tile-content
margin-top: 30px
@media (max-width: 768px)
.tile
width: 50%
min-width: calc(50% - 0.75rem)
@media (max-width: 480px)
.tile
min-width: calc(50% - 0.75rem)
@media (max-width: 380px)
.tile
min-width: 100%
はアイテムが小さな画面上で縦に積み重ねると大きな上に水平に置く必要があります...です。しかし、Safariでは常に水平で、積み重ねることはありません（ブラウザのサイズが調整されたとき）。
私はフォールバックオプションを提供することができますが、私はこれに間違っているかもしれないどこに投資するのに役立つのが本当に好きです。誰かが私が見落としているかもしれないことを理解するのを助けてくれますか？