Image de bordure arrêtée dans Safari (OS et iOS)

Question

L'image de bordure a cessé d'apparaître dans Safari sous OS et iOS. J'utilise Safari 10 sur mon Mac et la dernière version d'iOS sur mon iPad et mon iPhone. Il montre dans Firefox la façon dont il a utilisé show sur tous les navigateurs.

URL du site est: 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;  

}

J'ai cherché à voir ce que je fais mal, mais toute déclaration semble être correcte. Toute aide est grandement appréciée.

Answer 1

Vous devez donner la frontière la même largeur que la frontière image:

border: 50px solid transparent; 

Answer 2

Je trouve une réponse à ce problème exact ici: border image not showing in safari. Voici ce qu'il dit:

"J'ai trouvé une solution et je voulais la partager au cas où quelqu'un aurait le même problème.Le problème a été résolu en supprimant la propriété raccourcie de la frontière et en la remplaçant par la bordure et la bordure -largeur."

Tels que ceci:

.borderWrap{ 

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

}

Au lieu de:

.borderWrap{ 

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

}