Twitter bootstrap Bootstrap 3.3.7-网格系统在Safari 10上不工作？

从文档中可以看出，它支持IOS和Mac桌面上的Safari

但为什么这就是我旅行中得到的

这是我的代码：

.表格项目{
显示：块；
利润率：0.5px；
边框：1px纯红；
身高：100%；
}
.col-lg-1、.col-lg-10、.col-lg-11、.col-lg-12、.col-lg-2、.col-lg-3、.col-lg-4、.col-lg-5、.col-lg-6、.col-lg-7、.col-lg-8、.col-lg-9、.col-md-1、.col-md-10、.col-md-11、.col-md-12、.col-md-2、.col-md-3、.col-md-4、.col-md-5、.col-md-6、.col-md-7、.col-md-8、.col-md-9、.col-sm、，.col-sm-5、.col-sm-6、.col-sm-7、.col-sm-8、.col-sm-9、.col-xs-1、.col-xs-10、.col-xs-11、.col-xs-12、.col-xs-2、.col-xs-3、.col-xs-4、.col-xs-5、.col-xs-6、.col-xs-7、.col-xs-8、.col-xs-9{
左侧填充：0；
右边填充：0；
}
/*等像高*/
/* http://stackoverflow.com/questions/42157249/css3-flex-stretches-the-image-instead-of-centering-it */
/*仅适用于大、中、小屏幕*/
/* https://scotch.io/tutorials/default-sizes-for-twitter-bootstraps-media-queries */
/*小型设备、平板电脑*/
/*中型设备、台式机*/
@仅介质屏幕和（最小宽度：768px），
@仅介质屏幕和（最小宽度：992px）{
.eq高度{
显示：-网络工具包盒；
显示：-webkit flex；
显示：-ms flexbox；
显示器：flex；
柔性包装：包装；
}
}
.eq高度>[class*='col-']{
显示器：flex；
弯曲方向：立柱；
}
.eq高度>[class*='col-']>[class*='col-']{
身高：100%；
}
/*隐藏实际图像，但使用内联封面图像*/
a、 网格项img{
不透明度：0
}
a、 网格项{
背景尺寸：封面
}
/*项目/瓷砖之间的间隙*/
.col-sm-3.col-sm-12，
.col-sm-6.col-sm-12，
.col-sm-3.col-sm-12+.col-sm-12{
边缘顶部：10px；
}
/*更改容器大小*/
.集装箱{
宽度：100%；
最大宽度：1400px；
最小宽度：320px；
保证金：0自动；
}
@仅介质屏幕和（最大宽度：1420px）{
.集装箱{
填充：0 20px；
}
}

Zurb 6支持Chrome、Firefox、Safari、Opera、Mobile Safari、IE Mobile（较旧的Windows Phone和Windows CE设备）、IE 9+和Android web浏览器2.3的最后两个版本+

---

我把你指给Zurb看是不公平的。由您决定需要支持哪些浏览器。我很乐意为您解答Zurb的具体问题。

谢谢。你如何把上面的引导网格转换成基础？我是基金会的新手。在Bootstrap上已经有很长时间了，有时会让人很沮丧！我只是不明白为什么简单的网格布局在Safari上会失败！