How to center main menu in Fluida

  • Author
    Posts
  • #37824
    Shannon

    I can’t figure out how to center the main menu in the Fluida theme. I’m not displaying a site title or logo and the menu is pushed to the right. I would like the main menu to be centered. I can’t see anyway to do this under customization. Does anyone know how?

    #37878
    Zed
    Cryout Creations mastermind

    The design is intended to use a logo/title space on the left. As such, the menu is aligned to the right.


    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    #38668
    pmdelgado1
    Power User

    @Shannon,
    It’s easy, first make sure you work on a child CSS, then find this line and change it to left, right, center:

    /*————————————————————–
    ## MAIN MENU
    ————————————————————–*/

    #access {
    display: inline;
    float: center;/*here is were you change it*/
    }

    You find the css inside the fluida folder, is call “style.css”. Make sure you work on a child, otherwise when you update your theme it will go back to default.
    @Fluida, your designs are awesome, can’t believe you could not provide this simple solution!

    • This reply was modified 7 years ago by pmdelgado1.
    #38712
    Zed
    Cryout Creations mastermind

    There is no float: left center value in CSS – https://developer.mozilla.org/en-US/docs/Web/CSS/float#Values
    At most you could use

    body #access {
        display: table;
        float: none;
        margin: 0 auto;
    }

    but this may cause issues with responsiveness.

    • This reply was modified 7 years ago by Zed. Reason: Fixed a typo that ruined the whole meaning

    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    #38721
    pmdelgado1
    Power User

    Hi Zed, yes, absolutely there is no float left in Fluida, it was just as a matter of speech, I stay corrected; there is only float: right; I have to say, Fluida is a robust theme, I made the simple switch from float: right; to float: center; and it works great. The menu displays perfect in small devices, thus far no problem. I purchased the css to remove the footer, and I would purchase the option to show tagline without hesitation. I absolutely love the theme, it is clean, easy to read, and it offers that “traditional” feel of right/left column. It would be great if you can offer that upgrade to center the menu with the tagline :), you’ll have a customer for life!

    #38810
    Zed
    Cryout Creations mastermind

    Sorry, pmdelgado1, I meant to say there is no float: center in CSS above.


    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    #38874
    pmdelgado1
    Power User

    Awesome ! You guys ROCK ! thank you, thank you, thank you … 10 stars if I could rate you!

    #38959
    Zed
    Cryout Creations mastermind

    pmdelgado1, you can rate the theme 😉


    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    #39863

    Now when I create a child theme all I see in the theme editor is that:
    This child theme inherits templates from a parent theme, Fluida.
    Can I edit the main theme to display the main navigation centered or will it revert back to the original when updated.
    Also can I just cut and paste the original style sheet into the child theme style sheet?

    #39920
    Zed
    Cryout Creations mastermind

    Fluida already includes a menu alignment option since a couple of versions back.


    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘How to center main menu in Fluida’ is closed to new replies.