Z-index似乎没有改变任何东西

Question

我正在构建一些自定义下拉控件，并且z-index无法正常工作。任何帮助表示赞赏。

http://jsfiddle.net/heray/1/

如果你点击的项目，你会发现下拉菜单出现后续的下拉列表后面。我已经添加了z-indexes和相对于我能想到的每个元素的位置。

Answer 1

只要你知道如何使用z索引，除非你希望它显示在另一个元素的顶部从未分配的z-index的东西。最好的做法是不要定义一个z索引（特别是不要赋值为0），直到需要为止。在您的示例中，单击该按钮（实际下拉菜单）后您所拥有的类应具有1或更大的z索引，并且文档中没有其他任何应该具有任何z索引定义。如果您有一个z-index为1的元素，然后将另一个元素放置在z-index为2的相同物理位置中 - 具有较高z-索引的容器将与下一个元素重叠。

Answer 2

从下拉列表中删除z-索引。另外，是什么让你认为在它们上设置一个0的z-index会让事情变得更好？

Updated fiddle.