为什么这个菜单导航<div>不对齐？
为什么这个菜单导航<div>不对齐？
提问于 2011-09-25 20:34:36
我有一个网站有一个下拉导航栏在顶部，我想中心导航栏，但我无法使它工作，它似乎被困在左边。您可以查看网站这里，我已经粘贴了下面的代码。
我一整天都在努力让这件事起作用，但我不知道问题出在哪里。我不知道还能写些什么，任何帮助都是非常感谢的。
My style.css:
#menu{
position: absolute;
z-index: 1;
padding:0;
margin: auto;
}
#menu ul{
padding:0;
margin:0;
margin: auto;
text-align: center;
display: inherit;
}
#menu li{
position: relative;
float: left;
list-style: none;
margin: 0;
padding:0;
}
#menu li a{
width:100px;
height: 30px;
display: block;
text-decoration:none;
text-align: center;
line-height: 30px;
background-color: white;
color: #7B99FF;
font-size: 16px;
}
#menu li a:hover{
color: #000;
}
#menu li .subnav a {
color: #7B99FF;
font-size: 13px;
}
#menu li .subnav a:hover{
color: #000;
font-size: 13px;
}
#menu ul ul{
position: absolute;
top: 30px;
visibility: hidden;
}
#menu ul li:hover ul{
visibility:visible;
}
.subnav {
font-size: 13px;
}My index.php:
<div id="menu">
<ul>
<li><a href="#nogo">About me</a>
</li>
<li><a href="#nogo">Categories</a>
<ul class="subnav">
<li><a href="#nogo">Link 2-1</a></li>
<li><a href="#nogo">Link 2-2</a></li>
<li><a href="#nogo">Link 2-3</a></li>
</ul>
</li>
<li><a href="#nogo">Archive</a>
<ul class="subnav">
<li><a href="#nogo">Link 3-1</a></li>
<li><a href="#nogo">Link 3-2</a></li>
<li><a href="#nogo">Link 3-3</a></li>
</ul>
</li>
<li><a href="#nogo">Contact</a>
</li>
</ul>
</div>回答 1
Stack Overflow用户
回答已采纳
发布于 2011-09-25 21:25:55
删除#菜单的“绝对”位置，并给它一定的宽度：
#menu{
width:400px;
z-index: 1;
padding:0;
margin: auto;}如果不想手动设置宽度，可以用样式将根包在div中：
text-align:center页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/7548417
复制相关文章
相似问题
腾讯云开发者
