Css Safari中的标题未垂直居中

所以这个问题困扰了我很长一段时间。我有一个div容器，它将溢出图像居中放置

但是，在Safari中，div内的图标不位于中间。相反，它位于顶部。不过，它在其他浏览器中也可以正常工作。只有Safari有这个bug

我在下面系了一把小提琴。感谢您的帮助！：）

var$container=$（'#page'）；
$container.com({
columnWidth:“.grid sizer”，
itemSelector:“.item”，
位置：正确，
排水沟：10
});
#第页.项{
宽度：钙（16.66%-10px）；
显示：内联块；
身高：0；
浮动：左；
垫底：16.66%；
溢出：隐藏；
背景颜色：鲑鱼；
保证金：5px；
位置：相对位置；
}
#第页第1.s1项{
宽度：计算（50%-10px）；
垫底：50%；
溢出：隐藏；
背景色：海军蓝；
}
.项目>a{
/*位置：相对位置*/
显示：块；
溢出：隐藏；
颜色：白色；
}
.项目：悬停。网格图像：之后{
背景：rgba（0,0,0,7）；
}
.项目：悬停.网格图像>img{
-webkit转换：比例（1.1）；
-moz变换：比例（1.1）；
-ms变换：比例（1.1）；
-o变换：比例（1.1）；
转换：比例（1.1）；
}
.项目：悬停。项目标题{
不透明度：1；
z指数：3；
能见度：可见；
}
.项目说明，
.grid image>img，
.网格图像：在{
-webkit转换：所有0.3都易于输入输出0；
-moz转换：所有0.3秒都可从0秒变为0秒；
-ms转换：所有0.3秒均为0秒；
-o型转换：所有0.3秒均为0秒；
过渡：所有0.3秒均为0秒；
}
.项目说明{
位置：绝对位置；
排名：0；
底部：0；
左：0；
右：0；
背景：rgba（291061540.72）；
颜色：#fff；
可见性：隐藏；
文本对齐：居中；
不透明度：0；
显示：表格；
身高：100%；
宽度：100%；
}
.项目标题>div{
显示：表格单元格；
身高：100%；
垂直对齐：中间对齐；
}
.网格图像{
位置：相对位置；
溢出：隐藏；
}
.网格图像img{
显示：块；
溢出：隐藏；
}
.网格图像：在{
位置：绝对位置；
显示：块；
内容：“；
身高：100%；
宽度：100%；
排名：0；
左：0；
}

我可以推荐另一种方法吗？您可以使用绝对定位和变换。看看我的答案，让我知道这是否是你想要的！