尽管通常的技巧,CSS下拉菜单不会成为中心

时间:2014-08-06 03:50:47

标签: css menu center

有一段时间让我的CSS下拉菜单居中。我知道这个问题以前曾被问过,但他们的解决方案似乎没有起作用。我尝试了margin:auto技巧,将float:left更改为display:inline-block,并尝试将其置于一个看不见的,居中的超级层中。什么都没有帮助。 :)我错过了什么?

.nav ul ul {
display:none;
}

.nav ul li:hover > ul {
display:block;
}

.nav ul {
display:inline-block;
position: absolute; 
padding: 0;
margin-left:auto;
margin-right:auto;
margin-top:0;
margin-bottom:0;

background:#fff8e0;
font-family: hofstad;
font-size:30px;
color:#6f0018;
padding-top:20;
padding-bottom:20;
list-style-type: none;
}


.nav ul li {
float:left;
margin-left:50;
margin-right:50;}

.nav ul li a {
;} !--main links, if they are links--!

.nav ul li:hover {
color:#980122;
}

.nav ul li:hover > ul { 
margin:0; 
padding-top:20;
padding-bottom:0;
padding-left:0;
padding-right:0;
} 

.nav ul li:hover > ul li {  
float:none; 
margin-left:0; 
margin-right:0;
padding-top:0;
padding-bottom:5;
padding-left:5;
padding-right:5;

}

.nav ul li:hover > ul li a {  
color:#980122; 
}

.nav ul li:hover > ul li a:hover { 
color:#6f0018;  
}

1 个答案:

答案 0 :(得分:0)

如果没有看到它在调试中,它有点难。

但它最初看起来像你的UL定位为"绝对"一旦你这样做,它就会被拉出主文档流程。

尝试使用哪个父元素具有"亲属"它的位置锚定到。