Css Blogger下拉菜单

这是我的博客模板的Css代码

我试图解决每一个细节，但我仍然面临问题。。。当我浏览maim菜单元素时，我可以看到下拉菜单，但我无法单击子菜单项，当我尝试浏览子菜单窗口时，它会消失

你能帮我一下吗

.post {
    border:1px solid #000000;
    border-style:solid;
    border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    background:#ffffff;
    margin:0.1em .5em;
    padding:0px 15px 0px 15px
}
.Header h1 {
    text-shadow: 4px 4px #191919;
}
/*----- MBT Drop Down Menu ----*/
#mbtnavbar {
    /* background: #a3a3a3; */
    width: 960px;
    color: #FFF;
    margin: 30px;
    padding: 0;
    position: relative;
    border-top:0px solid #000000;
    height: 5px;
}
#mbtnavbar {
    borderleft:0px solid #000000;
    border-right:0px solid #000000;
    border-bottom:0px solid #000000;
}
#mbtnav {
    background:#ededed;
    margin: 0;
    padding: 0;
}
#mbtnav ul {
    float:left;
    list-style: none;
    margin: 0;
    padding: 0;
}
#mbtnav li {
    list-style: none;
    margin: 0px;
    padding: 0px;
    /* border-left:1px solid #333; border-right:1px solid #333; */
    height:40px;
}
#mbtnav li a, #mbtnav li a:link, #mbtnav li a:visited {
    color: #000000;
    display: block;
    font:bold 22px Times new roman, Tahoma, Helvetica, FreeSans, sans-serif;
    margin: 0px;
    padding: 9px 12px 10px 12px;
    text-decoration: none;
}
#mbtnav li a:hover, #mbtnav li a:active {
    background: none;
    color: #000000;
    display: block;
    text-decoration: underline;
    margin: 0px;
    padding: 9px 12px 10px 12px;
}
#mbtnav li {
    float: left;
    padding: 0px;
}
#mbtnav li ul {
    z-index: 9999;
    position: absolute;
    left: -999em;
    height:160px;
    width: 170px;
    margin: 0px;
    padding: 0;
    border-bottom:1px solid #000000;
    border-top:1px solid #000000;
    border-right:1px solid #000000;
    border-left:1px solid #000000;
}
#mbtnav li ul a {
    width: 180px;
}
#mbtnav li ul ul {
    margin: -25px 0 0 161px;
}
#mbtnav li:hover ul ul, #mbtnav li:hover ul ul ul, #mbtnav li.sfhover ul ul, #mbtnav li.sfhover ul ul ul {
    left: -999em;
}
#mbtnav li:hover ul, #mbtnav li li:hover ul, #mbtnav li li li:hover ul, #mbtnav li.sfhover ul, #mbtnav li li.sfhover ul, #mbtnav li li li.sfhover ul {
    left: 295px;
}
#mbtnav li:hover, #mbtnav li.sfhover {
    position: static;
}
#mbtnav li li a, #mbtnav li li a:link, #mbtnav li li a:visited {
    background: #f1f1f1;
    /* width: 100px; */
    color: #000000;
    display: block;
    font:bold 14px Times new roman, Tahoma, Helvetica, FreeSans, sans-serif;
    margin: 0;
    padding: 9px 12px 10px 12px;
    text-decoration: none;
    z-index:9999;
    border-bottom:1px solid #000000;
}
#mbtnav li li a:hover, #mbtnavli li a:active {
    background: none;
    color: #000000;
    display:block;
    margin: 0;
    padding: 9px 12px 10px 12px;
    text-decoration: underline;
}
.tabs-inner .widget #mbtnavbar li a {
    border-left:none;
}
.tabs-outer .widget, .section {
    margin:0;
}
.tabs-inner {
    padding: 0px;
}

---

解决方案的总体思路是使

li

元素成为

position:relative

，因为它们包含子菜单

ul

元素（绝对定位）

子菜单

ul

元素应具有

left:0

或类似属性，以便将它们放置在父元素附近

添加

位置：相对到规则
#mbtnav li
和
#mbtnav li:hover、#mbtnav li.sfhover
以及设置
左：0px而不是
左：295px关于规则

#mbtnav li:hover ul, 
#mbtnav li li:hover ul, 
#mbtnav li li li:hover ul, 
#mbtnav li.sfhover ul, 
#mbtnav li li.sfhover ul, 
#mbtnav li li li.sfhover ul

结果显示功能菜单。

演示

要获得更多帮助，您需要提供代码的工作演示


更新

查看实时站点后，问题在于使用错误的值设置
height
属性

你需要


取下
高度：30px来自
#mbtnavbar
规则

从
#mbtnav li
规则中删除
高度：41px
取下
高度：160px#mbtnav li ul
规则的code>（您还需要从该规则中删除
边框底部：1px solid#000000；
）


在那之后，它应该可以正常工作
发布未缩小的CSS以及显示问题的相关HTML代码更有用。正如Gaby所说，HTML也会非常有用。很难按照列表中的列表进行操作，仅凭CSSHi Gaby，我就按照您的步骤进行操作。。。但是它不起作用。。不，我甚至可以看到下拉菜单：（@user3380659）如果不访问页面的html/css，我无法提供更多帮助。如果你能提供一个实时链接，我可以查看更多…这是我的博客链接。你需要我向你发送完整的html代码吗？