Question

我有问题..我无法将导航设置为水平..请教我如何将导航菜单对齐并将其放在WordPress的中心位置？

我是WordPress的新手..请帮帮我

谢谢！

这是用于导航的CSS：

#toppart #mainnav {
margin: 40px 0 0;
max-width: 100%;
float:none;
text-align:center;
}

#toppart #mainnav ul li {
float: none;
list-style: none;
position: relative;
display:inline;
background: #16212b;
padding: 9px 14px;
}

#toppart #mainnav ul li a {
margin:0;
padding:9px 14px;
display: inline;
}

#toppart #mainnav ul ul {
display: inline;
float: none;
position: relative;
margin-left:20px;
top:0;
left: 0;
z-index:none;
text-align:center;
}

#toppart #mainnav ul ul ul {
display: inline;
float: none;
position: relative;
margin-left:40px;
top:0;
left: 0;
z-index:none;
text-align:center;
}

#toppart #mainnav ul ul li {
border-bottom:1px solid #000;
text-align:center;
}

#toppart #mainnav ul ul ul li {
border-bottom:none;
text-align:center;
}

#toppart #mainnav ul ul li a {
background:none;
display:inline-block;
width:100%;
list-style:square;
text-align:center;
}

#toppart #mainnav ul li a:hover {
background:none;
text-align:center;
}

}

Answer 1

请确保您已将浮动留给特定。

#toppart #mainnav ul li { 
float: left;
list-style: none;
position:relative;
display:inline;
background: #16212b;
padding: 9px 14px;
}

我认为它应该有用。

Answer 2

我认为你应该使用像

这样的想法

#toppart #mainnav ul ul li {
float: left;
position: relative;
}

在Wordpress菜单中，您将拥有li个标记内的所有项目，以便您可以使用属性float: left;和position: relative;来使它们水平对齐

无需更改显示属性

Answer 3

  #toppart #mainnav ul ul li {
    float: left;
    position: relative;
     margin-left:20px;
display:inline;

如何在wordpress中对齐导航菜单？

3 个答案: