下拉菜单消失

时间:2014-11-10 23:22:32

标签: css drop-down-menu

我创建了一个下拉菜单并将其添加到博主。它无法在Chrome或Safari中使用。问题是,首次滚动时会出现下拉菜单,但在第一个子菜单项后会消失。这不是在Firefox或IE中发生的,只是Safari和Chrome中的问题。它可能是一个z指数问题吗?任何帮助表示赞赏。我正在添加以下代码:

#navigation {
    font-family: verdana;
    font-size: 18px;
    font-weight: bold;
    padding: 0px;
    margin: 0px;
    list-style-type: none;
}
#navigation li {
    position: relative;
    float: left;
    margin: 0px 0px 0px 0px;
    z-index: 30;
}
#navigation li a {
    display: block;
    padding: 8px 13px;
    -moz-border-radius-topleft: 0px;
    -webkit-border-top-left-radius: 0px;
    -moz-border-radius-topright: 0px;
    -webkit-border-top-left-right: 0px;
    background: #00ddf5;
    color: #ffffff;
    text-decoration: none;
}
#navigation li ul {
    position: absolute;
    left: -89px;
    top: 0px;
    display: none;
    padding: 0px;
    margin: -11px;
    list-style-type: none;
    z-index: 20
}
#navigation li.over ul li {
        float: none;
        margin: 0px!important;
        top: 10px; 
}
#navigation li.over a {
    background: #a7f6ff;
}
#navigation li.over ul {
    padding: 0px!important;
    display: block;
    background: #00ddf5;
    -moz-border-radius-bottomleft: 0px;
    -webkit-border-bottom-left-radius: 0px;
    -moz-border-radius-bottomright: 0px;
    -webkit-border-bottom-left-right: 0px;
    -moz-border-radius-topright: 0px;
    -webkit-border-bottom-top-right: 0px;
}
#navigation li.over ul li a {
    font-size: 18px;
    padding: 0px 30px;
    background: none;
    white-space: nowrap;
}
#navigation li.over ul li a:hover {
    background: #000000;
    color: #ffffff;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
}

0 个答案:

没有答案