Flex項目在Safari中沒有高度

我正在使用Flexbox創建複雜的網格佈局（我需要支持的CSS瀏覽器不支持CSS Grid）我的佈局在Chrome和Firefox中完全按預期工作，但在Safari上，我的大多數flex項目都有0高度，並且顯示不正確。Flex項目在Safari中沒有高度

我創建了一個CodePen所以展示在我的代碼是（很抱歉沒能CSS，不得不復制和我的項目輸出粘貼）如果你訪問上面的鏈接的Chrome/Firefox的 https://s.codepen.io/glennflanagan82/debug/NgPXJR/LQkExPgxmyxA

你應該在瓷磚上看到帶有懸停功能的網格佈局，但是Safari沒有圖像顯示，也沒有任何文字。我確定這是Safari設置grid-tile__link元素有0高度，但我不明白爲什麼。

我完全沉迷於此，所以任何幫助將不勝感激。

我認爲這裏的答案可能有幫助。父母需要在Safari中有一個確定的高度： Chrome/Safari not filling 100% height of flex parent

2017-06-05 17:45:19 arsea

謝謝。事實證明，Safari並沒有很好地處理嵌套項目，並在其上設置了「flex-basis」。最後必須使用'flex'屬性。 –

回答