How to Center the Primary Nav

Homepage Community Forums Ally Theme Support How to Center the Primary Nav

Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #2262
    Cove145
    Customer

      How would I go about centering the primary nav?

      Thanks
      Kris

      #2267
      Eric
      Customer

        If you can provide a link to your site then I can tell you which line you’ll need to adjust in your css.


        I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

        #2269
        Cove145
        Customer
          #2279
          Eric
          Customer

            Are you referring to the Primary Navigation that shows under the logo/header or the header right widget area?  Because all I see is the header right widget area nav.


            I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

            #2288
            Cove145
            Customer

              I added it now.

              #2294
              Eric
              Customer

                In your css file, add “text-align: center;” to line 306 (.menu-primary).

                Then on or around line 317 change the float to “none” and add “display: inline-block;” like this –

                .menu-primary li, .menu-secondary li, #header .menu li {
                display: inline-block;
                float: none;
                list-style-type: none;
                }


                I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

                #13043
                socialspark
                Customer

                  Hi Eric,
                  Let me know if I need to open another ticket, but I’m trying this on the latest version of Ally and I don’t see .menu-primary in my CSS or the .menu-primary li, etc. section. Did some of these change with the update to the theme?
                  Here’s my site address: http://541.38f.myftpupload.com/

                  Thanks,
                  Fran

                  #13048
                  Wes
                  Moderator

                    @socialspark I can help with this….Since the above conversation is dated back in early 2013 it’s safe to say they were using an older version of the theme. However, we can still get your menu to center in the version you’re using. If you have a look in your style.css near line 1630 you’ll see this –

                    .genesis-nav-menu .menu-item {
                        float: left;
                        list-style-type: none;
                        margin: 0;
                        padding: 0;
                        text-align: left;
                    }

                    Change the float: left to none and add display: inline-block;. It should look like this when you add in those changes –

                    .genesis-nav-menu .menu-item {
                        display: inline-block;    
                        float: none;
                        list-style-type: none;
                        margin: 0;
                        padding: 0;
                        text-align: left;
                    }

                    I tested this on your site and this was the result – http://i.imgur.com/Mg0KbTO.png

                    Let me know if you get it working.

                  Viewing 8 posts - 1 through 8 (of 8 total)
                  • You must be logged in to reply to this topic.