How do I center the Entire Primary Navigation Menu?

Homepage › Community Forums › Optimal Theme Support › How do I center the Entire Primary Navigation Menu?

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • February 27, 2013 at 11:31 am #2960
    dbaumga797
    Customer

      I want to center the entire primary navigation menu (not the text…the menu itself). I’m sure it’s a simple CSS modification, but can’t seem to find the right code.

      February 27, 2013 at 3:27 pm #2964
      Wes
      Moderator

        I usually recommend everyone post a link to their site so I can tell them the exact line that they’ll need to make changes to. If you haven’t really made any changes to your css, then you should be able to do it by following these steps –

        First look for this in your css – #nav .wrap and add – text-align: center; which will look like this –

        #nav .wrap {
        margin: 0 auto;
        text-align: center;
        width: 960px;
        }

        Then look for – .menu li and change the float: left; to float: none; ….then add display: inline-block; which will look like this –

        .menu li {
        display: inline-block;
        float: none;
        list-style-type: none;
        }

        Let me know if that works

        February 27, 2013 at 5:08 pm #2966
        dbaumga797
        Customer

          Sorry about not including the link (meant to but didn’t).

          But it wasn’t necessary as the instructions above worked perfectly! Thanks!

           

          -David

          February 27, 2013 at 5:50 pm #2967
          dbaumga797
          Customer

            I spoke too soon, but am almost where I want to be…

            The navigation menu is now centered, but so is the text in the sub-menu (which I want to be left aligned).

            Here’s the site link: http://www.pinecrestonline.org

            Thanks!

            February 27, 2013 at 11:00 pm #2970
            Wes
            Moderator

              Try adding this code to your css –

              .sub-menu li {
              text-align: left;
              }

              This should make all of the links inside of your submenu align to the left, which shouldn’t affect the main navigation.

              Let me know if that works.

              February 27, 2013 at 11:01 pm #2971
              Wes
              Moderator

                It looks like your site is coming together pretty nicely.

                Great job!

                February 28, 2013 at 9:09 am #2977
                dbaumga797
                Customer

                  That worked perfectly….thanks!!

                  And we love this theme, gives our church a clean, professional look!

                  Thanks again!

                  February 28, 2013 at 11:21 am #2979
                  Wes
                  Moderator

                    You’re Welcome!

                  • Author
                    Posts
                  Viewing 8 posts - 1 through 8 (of 8 total)
                  • The topic ‘How do I center the Entire Primary Navigation Menu?’ is closed to new replies.