border-image属性在Safari和iOS上显示效果不佳

Question

要在虚线边框上获得圆点，我在CSS中使用了以下内容

{
    border: dotted #78af00;
    border-image-repeat: round;
    border-image-slice: 26% 30%;
    border-image-source: url('dots.svg');
    border-image-width: 0 5px 0 0;
}

在chrome / firefox上完全可以正常工作（请参见下图）

但是，野生动物园中的东西看起来像这样（长点），

，并且在Apple移动设备上看起来更糟（在android上运行正常）。我需要一些帮助来了解如何解决此问题，以便在所有平台和浏览器上都有共同的外观和感觉？