svg在firefox和safari或chrome中的显示差异

<svg xmlns="http://www.w3.org/2000/svg"
width="300" height="100" viewBox="0 0 300 100" style="padding-left: 20px !important">
<text x="-15" y="30"
    style="font: 20px PakType Naqsh; inline-size: 200px; direction: rtl; text-anchor: end">
哈得发疯无法现在出发
</text>
</svg>

svg的padding-left设置后，把text的x设为负值，
在safari或chrome中padding-left不会遮盖text，
firefox会遮盖。如图：

解决办法：不设置padding-left，给text设置translate。
原因：猜测是firefox的兼容问题。没找到官方的解释。