css - 尽管有常用技巧，但CSS下拉菜单不会居中

有一段时间让我的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;
}

最佳答案

很难看到它在进行调试。

但是，一开始，它看起来就好像您的UL被定位为“绝对”，将其从主文档流程中拉出。

尝试使用哪个父元素具有“相对”位置来定位。

关于css - 尽管有常用技巧，但CSS下拉菜单不会居中，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25151933/