请参阅捕获。正如您所看到的,第一个下拉菜单正常工作,子菜单确实显示,并且水平显示但不垂直列出。
CSS代码:
#topbanner {
width:100%; height:25px; margin:0;position:relative;background-color:#4c4e5a;display: block;}
.rightmenu, .rightmenu ul, .rightmenu li, .rightmenu a { margin: 0; padding: 0; border: none; outline: none; }
.rightmenu { float: right; }
.rightmenu li a{
display: block; padding: 0 14px; margin: 3px 0;color: #f3f3f3;background-color: #4c4e5a;}
.rightmenu ul {
position: absolute;
opacity: 0;
background-color: #4c4e5a;
left: auto;
right:0;
width:180px;
}
.rightmenu ul ul {
position: absolute;
opacity: 0;
right: 100%;
top: 0%;
background-color: #4c4e5a;
width:180px;
}
.rightmenu li:hover > a { color: #8fde62; }
.rightmenu li:hover > ul { opacity: 1; }
.rightmenu ul li{
height:0;
overflow:hidden;
padding: 0;
}
.rightmenu li:hover > ul li {
height: 25px;
overflow: visible;
padding:0;
}
.rightmenu ul li a {
white-space: nowrap;
border: none;
}
我省略了一些样式,以便让代码缩短。 (如阴影,边框样式和圆角)
答案 0 :(得分:1)
你想要抛出一个
clear: both
你的ul ul li