边框图像停止在Safari(OS和iOS)中显示

时间:2016-12-20 23:04:32

标签: ios css safari border-image

边框图像也停止在OS和iOS上的Safari中出现。我在我的Mac上使用Safari 10,在iPad和iPhone上使用最新版本的iOS。它确实在Firefox中以其在所有浏览器上显示的方式显示。

网站网址为:http://majesticpinescolorado.com/

 #sidebar .inner{
border: 1px solid #8e8cae; 
-moz-border-image:url(images/border.png) 50 50 repeat; /* Old firefox */
-webkit-border-image:url(images/border.png) 50 50 repeat; /* Safari */
-o-border-image:url(images/border.png) 50 50 repeat; /* Opera */
border-image:url(images/border.png) 50 50 repeat;    

}

我研究了看我做错了什么,但所有声明似乎都是正确的。非常感谢任何帮助。

2 个答案:

答案 0 :(得分:1)

我在这里找到了这个确切问题的答案:border image not showing in safari。这就是它所说的:

“我能找到一个解决方案,想要分享它以防有人遇到同样的问题。通过删除边框速记属性并用border-style和border-width替换它来解决问题。”

如:

username

}

而不是:

.borderWrap{

border-style: solid;
border-width: 34px;
border-image: url(../images/spriteOneFrame.png) 34 34 round;

}

答案 1 :(得分:0)

您需要为边框指定与border-image相同的宽度:

border: 50px solid transparent;