剪切路径仅在Safari中被部分切断

Question

我在包含动画svg的子div上有一个剪切路径。一切都可以在Chrome和Firefox中完美运行。这是正确渲染的屏幕截图。

http://lanlanliu.com/demo/verum/verum-correct.png

但是，在Safari中，剪切路径的一部分被神秘地切断了。这是错误渲染的屏幕截图。如您所见，仅部分字母（即剪切路径）可见，并且部分修剪不正确。

http://lanlanliu.com/demo/verum/verum-wrong.png

我认为这可能与

有关

width: 100%; 
height: auto;

我给父（剪切路径）div的

设置。在Chrome和Firefox中，剪辑路径会自动按比例缩放以适合。但是在Safari中，计算不正确，并且剪切路径缩放错误。我为preserveAspectRatio尝试了不同的设置，但似乎没有任何效果，因此，我非常感谢您的帮助。这是CodePen的链接：https://codepen.io/lanlanonearth/pen/GVEwJj