下拉菜单栏的CSS z-index属性

Question

我有一个下拉菜单栏。但是，无论我将条形图的z索引设置得多高，或者如果我将内容的z索引设为-1，它总是在我的内容后面。有人能帮忙吗？

我确实将z索引设置为500，在那里我可以悬停导航顶部菜单，但没有更改。可能是因为我在CSS代码开头使用了重置代码吗？

这是我的CSS代码：

/*navigation.xhtml; author: Mica */
#navigation {
    float:left;
    width:100%;
    height:18px;    
    margin:15px 0 25px;
}
#navigation ul {
    list-style-type:none;
    list-style-image:none;
    padding:0px;
    float:left;
    width: 100%;
}
#navigation li.topmenu {
    float:left;
    width:170px;
}
.topmenu a {
    float:left;
    width:100%;
    text-align:center;
}
.topmenu ul {
    float:left;
    display:none;
    width:100%;
}
.topmenu a, .submenu a, .topmenu:hover .submenu a {
    padding:3px 0;
    border:1px solid #C27000;
    color:#FFFFFF;
    font-weight:bold;
    text-decoration:none;
    background-color:#FF8C00;
    margin:0;
    font-weight:bold;
}
.submenu a{
    width:100%;
    clear:both;
    postition:absolute;
}
#navigation a:hover, .topmenu.on a, .topmenu:hover a {
    background-color:#FFA500;
}
.topmenu:hover ul {
    display:block;
    z-index:500;
}
#logo a:hover {
    opacity:0.8;
}
/*content in basicTemplate.xhtml; author: Mica */
#content {
    float:left;
    min-height:200px;
    margin:0 7px;
}

Answer 1

HAHAAA找到了！z索引只有在首先声明位置时才有效：所以我需要在这个块中设置一个位置：

.topmenu:hover ul {
    display:block;
    z-index:500;
}

像这里：

.topmenu:hover ul {
    display:block;
    position:relative;
    z-index:500;
}