CSS变换+z-index问题

Question

还有一个关于它的问题，但我还没有在SO上发现完全相同的问题。

所以我尝试保留已翻译元素的子元素的 z-index 位置。 请参阅此处的问题：http://codepen.io/anon/pen/XjvLoW?editors=0100。

如果您注释 div 中的行

transform: translateX(30%);

，z 索引将再次起作用。

到目前为止，我已经尝试过

translate3d()

强制重新渲染或相反

transform-style: flat;

以及许多其他东西，但没有运气。

我知道我可以通过翻译内部的

p

元素（而不是父元素）来解决问题，但在我真正复杂的上下文中我不能。 有人可以给我一个好的建议吗？

谢谢您的帮助！

[编辑]

我无法在

div

元素上设置 z-index，这不是我想要的，因为这个 div 包含我想要位于

:before

背景后面的其他元素。

在滑动窗格从左侧推送内容的情况下。我尝试只保留覆盖层上方的窗格。不是它也包含的右侧内容。

在这里，我更新了 codepen 以更好地反映我的问题：http://codepen.io/anon/pen/BQBBoy?editors=0100

Answer 1

试试这个..

照常使用您的代码，只需将

z-index: 0;

赋予

div

元素，因为您给出了

position: relative;

它会默认堆叠该元素。

代码笔

Answer 2

提供调查工作，以客观目的进行调查 自然科学领域的游戏策略 IE Julián Pinto Buendía del Corregimiento 5° 毕业生 de Mateo Gómez – Cereté, con la Finalidad de motivar a los estudiantes a mejorar Su aprendizaje y rendimiento académico midte nuevas dinámicas.埃斯特 Sentido，sebusca 激励教育者和游戏相关的旅行 la asignatura, nuevas temáticas que les brinden la oportunidad de indagar, crear, Buscar y descubrir nuevos conocimientos.