Css SVG下方出现的空格（仅在Google Chrome中）

我正在构建一个站点，其中包含许多使用SVG创建的曲线

除了Chrome之外，这些浏览器在所有浏览器中都能完美工作，在特定的浏览器宽度下，它们的高度会略微降低，在浏览器下方留下一小块空白

你明白我的意思了

我已按建议指定了宽度、最大宽度、高度和最大高度，但未成功

有没有关于为什么会发生这种情况以及如何解决的想法

提前感谢,

汤姆

编辑：这里有一个屏幕截图来显示我的意思。紫色曲线的顶部边缘不应有细白线：

---

粗野的黑客行为。也许可以用101%来计算

.homepage_intro_section.purple.dark_purple_below .curve
{ 
   background-position:center calc(100% + 2px);
}

.dark_purple .curve
{
    background-position: center -3px;
}

我想你的bg对齐也有一些小问题（重复）

---

一定是我的烂监视器？我看不出你在这页上的意思是什么？你能拍一张放大的屏幕截图，或者在你看到问题的地方加上一个#锚吗？我在Chrome上制作的svg出现了一个非常小的边缘问题，我在元素上画了一个小笔画（不确定这是否对您的特定问题有帮助）？当然，屏幕截图补充道。遗憾的是，笔划出现在白色间隙下方，因此无法解决问题。SVG是通过CSS添加的，你认为添加HTML会有所不同吗？值得一提的是：我在chrome中查看了网页，没有看到这条白线。编辑：当我缩放时，它会显示出来。110%、125%、150%和200%（不是175%）。谢谢Philipp，你试过缩小浏览器窗口的宽度吗？线条没有以特定的大小出现，然后随着窗口变窄而变大，到达某个点后又消失了。@TomPerkins啊，是的，我没有调整足够的大小。即使在标准缩放下，我现在也能看到这条线。添加背景位置：中心计算（100%+2px）；谢谢你，凯瑞。这会被所有浏览器所接受吗？还是我应该提供某种回退？不用担心。我觉得应该很甜。我也喜欢SVG，我的错。事实上，我只是想再想想。我认为我们根本不需要计算器，只需要背景位置：中心2px；相同的值，浏览器的工作量更少。

.dark_purple .curve {
    background: url(../svg/extended-curve-purple-to-white.svg) center bottom no-repeat, none center no-repeat;