SVG文本元素需要Chrome和IE的不同位置值

Question

DEMO

对不起，演示代码有点长，但有问题的元素是
<text ... class="pva-mb-nav__steps__number"
它给出了球上的数字1,2,3,4 它具有属性dominant-baseline=central

当它具有属性y=20时，数字位于Chrome上的中间位置，但在IE11上则过高。 y=25时，IE11上的优点，Chrome浏览器太低了。

它的一些属性可以在CSS中设置，因为你看它是由CSS制作的。我认为如果它的位置可以通过CSS调整，那么让我应用IE-only hack。我尝试在CSS中放置y=xx或dy=xx或transform:translate(xx)，但没有一个有效。

问题：如何将数字放在Chrome和IE11的中间位置？

SVG需要100％扩展到其容器。

[编辑]刚发现IE11不支持dominant-baseline。这必须是原因。然后中间对齐数字，我必须顶对齐数字和球，然后手动计算文本的良好dy值吗？

Answer 1

删除dominant-baseline=central，放置y=25