0
我以为我在Code Pen中完善了我的CSS导航栏,但是当我在我的实际布局中实现它时,似乎我布局中的其他div破坏了下拉菜单(下拉菜单出现,但是当我移动鼠标来选择一个孩子时,下拉列表消失)。Div扰乱我的CSS菜单
下面是代码笔:http://codepen.io/anon/pen/cKJlu
这里,它是在我的网站实施:http://www.onedirectionconnection.com/tester
而这里的CSS:
.main-navigation {
clear: both;
display: block;
width: 90%;
margin: 0 auto 20px auto;
}
.main-navigation ul {
list-style: none;
margin: 0;
padding-left: 0;
}
.main-navigation li {
float: left;
position: relative;
margin-right: 15px;
}
.main-navigation li:last-of-type{
margin-right:0;
}
.main-navigation a {
text-align: center;
font-size: 14px;
text-transform: uppercase;
display: block;
text-decoration: none;
font-weight: bold;
border-radius: 3px;
background-color: #269BA9;
width: 130px;
color: #fff;
}
.main-navigation ul ul {
display: none;
float: left;
position: absolute;
top: 1.5em;
left: 0;
z-index: 99999;
}
.main-navigation ul ul ul {
left: 100%;
top: 0;
}
.main-navigation ul ul a {
margin-top: 3px;
}
.main-navigation ul ul li {
}
.main-navigation li:hover > a {
background-color: #DA5969;
}
.main-navigation ul ul :hover > a {
}
.main-navigation ul ul a:hover {
}
.main-navigation ul li:hover > ul {
display: block;
}
.main-navigation li.current_page_item a,
.main-navigation li.current-menu-item a {
}
/* Small menu */
.menu-toggle {
display: none;
cursor: pointer;
}
如果有人可以帮助我弄清楚什么问题是,它将不胜感激。
这个伎俩!谢谢! – nellygrl
不客气。点击复选标记,因为它解决了您的问题。 – Chanckjh
我只是在等待5分钟的限制结束!检查了它! :-) 再次感谢。 – nellygrl