Html 对Safari的Flexbox支持

我为flexbox编写了以下代码，它在Chrome和Firefox中运行良好，但在Safari（任何版本）中都无效。我尝试了特定的前缀，但无法实现相同的简单顺序。我应该为Safari修改/添加什么，使其像Chrome和Firefox一样正常工作

.container{
显示：-webkit flexbox；
显示器：flex；
柔性流：行换行；
证明内容：周围的空间；
弯曲方向：行；
-webkit柔性方向：行；
列表样式：无；
}
李{
边界：10px鲑鱼固体；
填充：25px 15px；
文本对齐：居中；
字体大小：1.2米；
背景：白色；
-webkit-flex-grow:3；
柔性生长：3；
}

阿拉巴马州
加州
佛罗里达州
爱达荷州
堪萨斯州
内华达州
纽约

您需要为显示添加webkit前缀：

display: -webkit-flex;

---

您需要为显示添加webkit前缀：

display: -webkit-flex;

Safari 5（Safari的最新windows版本）仅支持使用旧语法和-webkit-前缀的flexbox。（

显示：-webkit框

）

.container{
显示：-webkit框；/*safari*/
显示：-ms flexbox；
显示器：flex；
柔性流：行换行；
-webkit flex flow:row wrap；/*Safari 6.1+*/
证明内容：周围的空间；
弯曲方向：行；
-webkit柔性方向：行；
列表样式：无；
}
李{
边界：10px鲑鱼固体；
填充：25px 15px；
文本对齐：居中；
字体大小：1.2米；
背景：白色；
柔性生长：3；
}

阿拉巴马州
加州
佛罗里达州
爱达荷州
堪萨斯州
内华达州
纽约

Safari 5（Safari的最新windows版本）仅支持使用旧语法和-webkit-前缀的flexbox。（

显示：-webkit框

）

.container{
显示：-webkit框；/*safari*/
显示：-ms flexbox；
显示器：flex；
柔性流：行换行；
-webkit flex flow:row wrap；/*Safari 6.1+*/
证明内容：周围的空间；
弯曲方向：行；
-webkit柔性方向：行；
列表样式：无；
}
李{
边界：10px鲑鱼固体；
填充：25px 15px；
文本对齐：居中；
字体大小：1.2米；
背景：白色；
柔性生长：3；
}

阿拉巴马州
加州
佛罗里达州
爱达荷州
堪萨斯州
内华达州
纽约

我已经试过了，但是它不能让盒子像Chrome和FF一样正常工作。我已经试过了，但是它不能让盒子像Chrome和FF一样正常工作。谢谢Jojo，是的，我试过了-webkit盒子，但是没有flex flow，它看起来不正确，我正在寻找一个解决方案来实现简单的响应对齐，比如Chrome和FF，所以它也可以在Safari和iOS中使用。所以你不需要使用flexbox？那是另外一回事。。。我看看我能做些什么谢谢你。Flex grow有助于flexbox的布局，根据我的经验，它们是直接相关的…谢谢Jojo，是的，我尝试过-webkit box，但如果没有Flex flow，它看起来不正确，我正在寻找一种解决方案，以实现简单的响应对齐，如Chrome和FF，因此它也可以在Safari和iOS中工作。所以你不需要使用flexbox？那是另外一回事。。。我看看我能做些什么谢谢你。Flex grow有助于flexbox的布局，根据我的经验，它们是直接相关的……旁注：您使用过autoprefixer吗？它对于使用flexboxSide非常有用注意：您使用过autoprefixer吗？这对于使用flexbox是非常宝贵的