SVG文本元素未正确定位

我已经建立了一个极简主义的例子。我需要将文本元素放置在SVG的最顶端。但是，如果您检查文本元素，您将看到它实际上从SVG之外的某个地方开始（如Chrome上的-3px，-FF上的4px）--请参见下面的屏幕截图。我正在构建一些需要像素完美的东西，所以我需要让文本精确地从SVG开始的地方开始。如您所见，

rect

从它应该的位置开始

由于SO不允许我在文章中没有代码的情况下发布到JSFIDLE的链接，因此代码如下：

<svg width="100%" height="360" style="background-color: rgb(0, 249, 253);margin-top: 50px;">
  <rect y1="0" y2="100" x="0" width="100" height="100"></rect>
  <text x="100" y="0" dominant-baseline="hanging">2022</text>
</svg>

2022

知道为什么会这样吗

根据研究，悬挂的主要基线仅对像Devanagari这样的印度语脚本有意义。如果希望文本框的上边缘与特定的Y坐标对齐，请改用

边前文本

：

8888
绞刑
8888
边前文本

该空间用于放置重音符号。除了尝试和错误之外，没有其他方法可以解释这一点。奇怪的是，即使我完全删除了

主导基线，它仍然在奇怪地对齐（除了它在底部对齐）。既然你的解决方案有效，我就不再质疑了。谢谢