Moving menu bar

  • Author
  • #2200576


    Hi. I am currently using the AutoFocus theme, and I wanted to see if it was possible to move the menu bar. I want to make it horizontal and in the center. Is this possible?

    The blog I need help with is



    So have your purchased the premium upgrade bundle or not? With it you can edit the CSS but without it you cannot edit it.

    Premium bundle details

    Custom design – Frequently Asked Questions
    if you have the upgrade use this link so you can copy and paste your text into a thread that will appear in the CSS Forum where you will get the help you need.

    Every theme has detailed them description page with set up instructions. You have private blog. We Volunteers cannot view it and do not know which theme you are using and provide the link to the detailed theme description page and live demo site. Only Staff can view private blogs.



    I do have the premium bundle. And the site is now available to see.



    This is possible if you have upgraded your theme to enable custom design.

    If you have done this you should be able to adjust in CSS where the menu bar is.

    What you will want to is the following: You will change the header width to 100%.

    #header {
          width: 100%;

    Then you will go to your list items and change your width to auto and the change the display to inline-block. li {
          width: auto;
          display: inline-block;

    Finally, to center the whole operation, you will want to go to your unordered list element and add text-align center. ul {
          text-align: center;

    Once you have it centered you can adjust the padding between words if you would like. But this is the simplest way to move that menu. If you do not have access to the CSS customization you will not be able to insert and change this code.



    Oops! I missed one!

    You will want to change the width of the menu to 100% as well. {
          width: 100%

    This will allow the menu to actually center.



    Thank you so much, I really appreciate your help. Can you just tell me where to go to find the menu information in the CSS?



    I tried this and it’s looks exactly the same but it’s on the left and it’s not center or horizontal. Any more tips?



    @jswiftinfo — You can use the tips in our guide for How to Find Your Theme’s CSS to find the CSS used for that menu in your theme.

    If you’d like more CSS help, the best place to post is in the CSS Customization forum. The expert staff and volunteers in that forum can help you learn more about CSS and customize your site the way you’d like it. :)

The topic ‘Moving menu bar’ is closed to new replies.