Google chrome SVG被切断

我在这里找到了一个我不明白的答案。不幸的是，我还不能发表评论

这是答案的链接

鲍里斯·兹巴斯基（Boris Zbarsky）接受的答案描述了它为什么不起作用。我不完全理解这个答案，并想知道如何纠正这个问题，以便我可以使它在Firefox上工作

就我而言，SVG文本元素在所有浏览器上都存在， 在Internet explorer中，所有3个文本都可见， 在Firefox和chrome中，如果SVG文本元素位于屏幕右侧的1/4以上，则会将其删除。如果我通过“开发人员”选项卡将它们移动到假想的截止线左侧，它们就会显示出来

在这个奇怪的区域没有可能隐藏SVG文本的div或block

这是一个本地实现

---

任何关于正在发生的事情的帮助都会非常有用。

文本元素上的x坐标大于应用于父SVG元素的css宽度

这样一个简单的问题让我在圈里跑了好几个小时。

我也遇到了类似的问题：

我的区块在IE9中完全渲染，但在Chrome中略微被截断

修正：

---

我也遇到了同样的问题，那是为了一个徽标，为了解决这个问题，我只需要在illustrator中的artboard右边缘添加更多的空间。Firefox将图片的右侧剪短了一小部分

Firefox会扩展内容&如果你在artboard中的内容边缘没有足够的空间/宽度，它将被artboard边界（内容呈现的空间边缘）截断

---

解决方案：illustrator中创建的画板大小需要在艺术品边界周围更大，以便在Firefox中的内容周围提供更多空间

我也有类似的问题。尝试添加css属性：

overflow: visible

我可以通过调整viewBox来解决此问题（或类似问题）：

---

我也遇到了同样的问题，其中一个标记中有一个剪辑路径

`<g id="undraw_the_search_s0xf 1" clip-path="url(#clip0)">`.

``。

如果您删除了在本例中应该呈现完整SVG的选项，这是因为我们在一个页面中呈现多个SVG图标，并且它们具有相同的clipPath id，当在同一页面中呈现时，它们将使用另一个图标的clipPath

在这里了解有关clipPath的更多信息
我的svg圆形元素在左侧或顶部被截断了半个像素。这完全解决了这个问题。谢谢，我将
style=“overflow:visible”
添加到了正在剪裁的SVG元素中，效果很好。我使用Chrome控制台来确定需要将属性添加到哪些元素中。这是可行的，但却是一个bandaid解决方案。在使用前，请仔细检查（以下）——在许多情况下，它可能是更正确的解决方案。@cssyphus否，您提出的解决方案是“绷带”<代码>溢出：visible

是正确的选择，如果移动浏览器制造商不够聪明，没有切断桌面浏览器引擎没有的东西的话。我很生气这能奏效。谢谢！这对我帮助很大。我什么都没做，谢谢你！修正了我的问题。

`<g id="undraw_the_search_s0xf 1" clip-path="url(#clip0)">`.