CSS 翻译 going in front vs. behind another div

Question

我正在尝试使用 CSS 转换在 y 轴上转换 svg 图形。我对翻译部分没有问题：

transform: translate3d(0, -100px, 0);

但是，Y 方向向上 100px 会将 svg 图形移到父级后面 div。我已经尝试在各种元素上放置不同的 z-index，但无法让 svg 图形位于前面。

我的意思是：

在translate之后：

transform: translate3d(0, -100px, 0);

Answer 1

在我看来这不像是 z-index 问题，而是溢出。尝试在当前设置为隐藏的 .svg-container 上设置 overflow: visible。

Answer 2

设置溢出：在当前设置为隐藏的 .svg-container 上可见。这对我有用（受雨果席尔瓦的启发，他应该得到正确的答案）。我编辑了他的 post 修正案

编辑

实际上这只是部分修复，有效：

transform: translateY(-100px) translateX(-3px);

但这不是： transform: translateY(-100px) translateX(-3px);