Question

是的，所以，我一直在自我编辑一个相当复杂的网站，并且一直停留在涉及菜单的最后一部分。它有一个float：left命令（导航栏显示在屏幕的左边），我一直试图将它与文本对齐：中心（显示在屏幕中央）与包装但是不成功。

以下是编码：

#nav a {
    display: block;
    padding: 5px;
    color: #aaa;
    text-decoration: none;
    outline: none;
    font-weight: normal;
    font-family: "Droid Serif", Georgia ,serif;
}
#nav > .current-menu-item > a,
#nav > li a:hover { color: #4C4C4C }
.plus { color: #aaa }
#nav ul {
    position: center;
    display: none;
}
#nav li {
    float: left;
    position: relative;
    list-style-type: none;
    padding-bottom: 5px;
}
#nav li a {
    letter-spacing: 3px;
    font-size: 14px;
    text-transform: uppercase;
    padding: 8px 15px;

我是一个编程菜鸟，在试用和错误以及谷歌浏览器中的“检查元素”命令的组合中几乎存活下来。请温和，而不是解释：）

欢呼声，杰斯

Answer 1

如果您想将ul置于导航中心，只需将宽度添加到ul并 margin：0 auto; 如果您不想添加宽度，请查看How do I center align horizontal <UL> menu?

Answer 2

而非浮动为您的LI提供 display：inline-block 。写得像这样：

#nav li {
    display:inline-block;
    *display:inline;/* For IE*/
    *zoom:1;
    position: relative;
    list-style-type: none;
    padding-bottom: 5px;
}

编辑导航菜单 - 如何换行显示：阻止，浮动：左侧是否有中心菜单？

2 个答案: