有一段时间让我的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;
}
答案 0 :(得分:0)
如果没有看到它在调试中,它有点难。
但它最初看起来像你的UL定位为"绝对"一旦你这样做,它就会被拉出主文档流程。
尝试使用哪个父元素具有"亲属"它的位置锚定到。