Html 溢出隐藏不适用于safari中的绝对元素

.services{
利润率：0.40px0；
}
.ul服务{
列表样式：无；
}
.服务ul>li{
浮动：左；
宽度：168px；
文本对齐：居中；
}
.服务ul>li+li{
左边距：24px；
}
.服务ul>li.拇指{
边框：2px实心#b9b9b9；
边界半径：50%；
-moz边界半径：50%
-webkit边界半径：50%；
溢出：隐藏；
位置：相对位置；
利润率：0.14像素0；
}
.服务ul>li.拇指img{
显示：块；
边界半径：50%；
-moz边界半径：50%；
-webkit边界半径：50%；
最大宽度：100%；
高度：自动；
}
.服务ul>li.拇指跨度{
位置：绝对位置；
背景#95bd0d；
字体大小：14px；
线高：20px；
宽度：100%；
填充：8px 10px；
底部：0px；
左：0px；
颜色：#fff；
}

法克滕
斯派罗文特高级酒店


斯派罗文特高级酒店

这是一个有文档记录的

最好的解决方法是在

.thumb

规则中添加以下内容

-webkit-transform: translateZ(0);
-webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);

---

.services{
利润率：0.40px0；
}
.ul服务{
列表样式：无；
}
.服务ul>li{
浮动：左；
宽度：168px；
文本对齐：居中；
}
.服务ul>li+li{
左边距：24px；
}
.服务ul>li.拇指{
边框：2px实心#b9b9b9；
边界半径：50%；
-moz边界半径：50%
-webkit边界半径：50%；
溢出：隐藏；
位置：相对位置；
利润率：0.14像素0；
/*修复safari边界半径和溢出隐藏问题*/
-webkit转换：translateZ（0）；
-webkit遮罩图像：-webkit径向渐变（圆形，白色100%，黑色100%）；
}
.服务ul>li.拇指img{
显示：块；
边界半径：50%；
-moz边界半径：50%；
-webkit边界半径：50%；
最大宽度：100%；
高度：自动；
}
.服务ul>li.拇指跨度{
位置：绝对位置；
背景#95bd0d；
字体大小：14px；
线高：20px；
宽度：100%；
填充：8px 10px；
底部：0px；
左：0px；
颜色：#fff；
}

法克滕
斯派罗文特高级酒店


斯派罗文特高级酒店

它工作正常，不是100%，但很好

-webkit转换：translateZ（0）；

---

-webkit遮罩图像：-webkit径向渐变（圆形，白色100%，黑色100%）

实际上，建议在错误通知单中向溢出元素添加以下内容：隐藏

position:relative; 
z-index:0;

---

非常感谢你，佩特里奥利：）这与公认答案中的代码完全相同。