CSS翻译在前面还是在另一个div后面

Question

我试图用CSS转换来翻译y轴中的svg图形。翻译部分我没什么问题：

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

但是，在Y方向向上的100 up将svg图形移动到父div后面。我尝试过在不同的元素上添加不同的z索引，但是无法让svg图形出现在前面。

这是你想要的图片我的意思是：

​

​

在translate之后

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

​

​

Answer 1

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

Answer 2

Set溢出:在..svg容器上可见，当前将其设置为隐藏。这对我有效(灵感来自于雨果·席尔瓦，他应该得到正确的答案)。我修改了他的帖子

编辑

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

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

​

​

但事实并非如此：transform: translateY(-100px) translateX(-3px);

​

​