WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] How to center a menu

[Resolved] How to center a menu

  • Hi,

    Does anybody know how to center a menu when you don’t know the width? margin: 0 auto requires a width declaration. Because the menu can grow and shrink depending on the menu items I don’t know the width. It also needs to be responsive. text-align center isn’t working either.

    My div and container. If anybody can help. Thanks.

    <nav id="footer-navigation" class="footer-navigation" role="navigation">
    			<?php wp_nav_menu( array( 'theme_location' => 'secondary' ) ); ?>
        </nav>
Viewing 2 replies - 1 through 2 (of 2 total)
  • Scott Fennell

    @scofennellgmailcom

    I don’t think margin 0 auto requires a width declaration in all cases. In any event, I would try giving the list items display inline-block; float: none; and give the parent text-align: center.

    It would be helpful if you provided a link.

    Thank you. You were right on target. Unfortunately the site is on localhost so I am not able to provide a link. Here is what I ended up doing after a little firebug inspection and now have it centered perfectly.

    #menu-footer{
    	border:1px solid #ccc;
        border-width:1px 0;
        list-style:none;
        margin:0;
        padding:0;
        text-align:center;
    }
    #menu-footer li{
    	display:inline;
    }
    #menu-footer a{
    	display:inline-block;
        padding:10px;
    }
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘[Resolved] How to center a menu’ is closed to new replies.