用固定的位置将孩子放在父母的后面

Question

所以这就是我的问题，我有一个有音量按钮的音乐播放器。当我按下音量按钮时，按钮下面会出现一个框。因为我的背景不是扁平的，所以我想把那个盒子放在背景后面。我试着使用负的z指数，但它不起作用。你们能帮帮我吗？这是一个链接，音乐播放器在顶部屏幕(位置固定) http://hateittoo.com/?page=shows

PS:目前，该网站与Google Chrome配合使用效果更好。

Answer 1

移动volume_controls，使其不嵌套在music_player中。z-index不能低于父元素的值。

<div id="music_player"><!-- has background image you're trying to hide controls under -->
    ... 
    <div class="content" id="volume_controls" style="display: block;">
        ...
    </div>
</div>

要将它放在bg后面而不使用z-index，请将您的volume_controls元素移到music_player之上

Answer 2

您不能将子对象定位在其父对象之后。您将需要从播放器div中取出音量div，使它们都固定，然后使用z-index。