【问题标题】:How can i make the horizontal navigation menu center aligned如何使水平导航菜单中心对齐
【发布时间】:2014-08-28 19:55:07
【问题描述】:

我正在创建一个基于 21 主题的 Wordpress 主题,但不知道如何让导航栏自动居中,因此我不必不断更新它。

这是我的 CSS: http://pastebin.com/SGvKmXEb

这里是 PHP/HTML: http://pastebin.com/TBL1nzjV

CSS 中可能有重复的属性,但这只是因为我仍在尝试这个并测试多个东西......

提前感谢您的帮助!

【问题讨论】:

  • 请编辑您的问题以包含您正在使用的 CSS 和标记。如果您的链接或链接上的内容将来发生变化,那么此问题仍将提供帮助其他用户找到类似问题的解决方案所需的所有信息。
  • 好的,会的!谢谢!

标签: php html css wordpress themes


【解决方案1】:

这在您提供的测试站点上对我有用

#access li {

float: left; /*delete*/
display:block; /*delete*/

display:inline-block; /*add*/

}

#access ul {

margin-left: 25%; /*delete*/
margin-right: 25%; /*delete*/
width: 1000px; /*delete*/
height: 10px; /*delete*/

margin-bottom: 0px; /*add*/
margin-left: 0px; /*add*/
padding: 0px; /*add*/

}

【讨论】:

    【解决方案2】:

    我会选择内联块方法。

    .containerElement {
        width: 100%;
        text-align: center;
    }
    
    .childElements {
        display: inline-block;
    }
    

    为了使其在您的代码中工作,您需要删除 .containerElement (#access ul) 固定高度和 .childElements (#access li) 浮动属性。

    【讨论】:

    • 我已经尝试过了,没有发生任何不同 - 这是它的外观示例:yenrac.net
    猜你喜欢
    • 1970-01-01
    • 2012-06-01
    • 2017-12-30
    • 2016-01-18
    • 1970-01-01
    • 2019-01-02
    • 1970-01-01
    • 2012-10-08
    • 2014-07-12
    相关资源
    最近更新 更多