How To Align The Divi Theme Builder Menu Module To The Left Center or Right On Any Device Tutorial by Pee Aye Creative

How To Align The Divi Theme Builder Menu Module To The Right, Left, or Center

This quick Divi Pro Tip will clear up the confusion and show you how to align the Menu Module in the Divi Theme Builder to the right, left, or center.

Join subscribers on our YouTube channel and enjoy other Divi video tutorials!

How To Align The Divi Menu Text

Layout Toggle

When you open the Menu Module to the Design tab, you will notice the menu Style has three options:

  • Left Aligned
  • Centered
  • Inline Centered Logo

This is certainly confusing. The “Left Aligned” should say something like “Default” or “Custom,” so I’m not sure how that slipped through. Keep it on this setting, or if you had it on something else, set it back to “Left-Aligned” for this to work.

Left or right align in the Divi Menu module

Menu Text Toggle

The answer is to go to the next toggle, the “Menu Text” toggle. Once there, scroll down and you will find the typical text-alignment options that we have for any other type of text.

How To Align The Divi Theme Builder Menu Module To The Right, Left, or Center On Any Device

As you can see, there are options for left, center, right and justified text here. Changing this aligns the entire Divi menu text, and this is the hidden solution to an otherwise puzzling situation.

76

Last updated Aug 31, 2021 @ 6:20 pm

Please share this post!

Nelson Lee Miller (aka The Divi Teacher)

Nelson is the owner of Pee-Aye Creative in the beautiful state of Pennsylvania. He loves helping small businesses, exploring outdoors, building websites with Divi, and teaching others.

OUR ONCE A YEAR SALE IS HAPPENING NOW!!!

25% OFF all Divi Plugins, Courses, and Child Themes!

Leave A Response!

By commenting you agree to our Blog & YouTube Comments Policy

34 Comments

  1. Cédric Castella

    OK but… I have NOT this option when I try. Above text color, I don’t have text alignment

    Reply
      • Cédric Castella

        Yes, of course (but in french)

      • Najeeb KV

        1 : Select Layout Styel ” Left Aligned ”
        2 : Go to “Menu Text ” you can visible ” Text Align ” option under “Text Shadow”

  2. Raeanne

    I also do not have this option. I’m using the Fullwidth Section with the Fullwidth Menu Module, and there is NO text alignment setting under Menu Text. I have looked everywhere online and cannot find a solution to this. Going to try Divi support next, I guess!

    Reply
    • Raeanne Wright-Emory

      I figured this out! For anyone else stuck with this issue — make sure you have the Left-Aligned options selected under Layout. If you change the setting to Centered (which I had done) then the Menu Text alignment settings are not available. Change it back to Left-Aligned, then you can see the text alignment settings and choose Right, as suggested in this article 🙂

      Reply
      • Clay Ravin

        Hi Nelson, It would be good to update the tutorial to mention that you have to set the Layout Style to “Left Aligned” for the Text Alignment option to appear. Sure, you have a picture of it being selected, and you say that it should be called “Custom” or something like that, but you don’t actually mention that we have to select it for the second choice to appear.

      • Jelske Boonstra

        Thank you very much, this was confusing.

    • Nelson Lee Miller (aka The Divi Teacher)

      Hi Raeanne,
      In my humble opinion, I do not recommend anything labeled “fullwidth” because they are very outdated. You would be better off using regular modules.

      Reply
  3. John Drago

    Thanks man – just what I was looking for!

    Reply
  4. Holly

    PERFECT! Thanks!

    Reply
  5. Ryan

    Wow. Thank you!! I spent far too much time looking for this.

    Reply
  6. Asha

    Thank you Nelson! So simple – really appreciate you posting this!

    Reply
  7. whoami

    Is there a way to use the Inline Centered Logo for the Desktop and the left Alligned Version for the mobile devices?

    Reply
      • whoami

        Thank you for your answer. Okay i thought with some CSS it would be possible, but i am not good at it 😀
        In my case i made in the Theme Builder 2 Headers – One is only activated for the Desktop Browser and the other for the mobile devices.
        Can this cause some performance issues or something else?

      • Nelson Lee Miller (aka The Divi Teacher)

        Technically maybe but with that we’re talking a very, very, very tiny amount of difference. It is not a good thing to do a lot, but just one module duplicated like that is no issue.

  8. Ryan Bollenbach

    Awesome man, thanks for this tip! Helped me fixed up the nav real quick.

    Reply
  9. Katrin Zahnweh

    Thank you so much, Nelson! I’ve been looking so long for this, while it’s just such a simple fix 😉

    Reply
  10. Ryan Cohen

    This is great, Nelson, however, the dropdown menu is being cutoff (off screen) to the right.

    Reply
    • Hemant Gaba

      Could you please share the URL of the page for us to investigate further?

      Reply
  11. Tammy Adkins

    Is there a way to shift the logo also? The logo and menu text are now too far apart on desktop view.

    Reply
  12. Joseph Jordan

    How to move the menu to the top left corner, not just to the left a little bit?

    Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

Asset 7

Shop Our Divi Products

Plugins • Courses • Templates

Visit The Shop

Divi Adventure Club Product And Course Membership by Pee Aye Creative

Become A Member!

Gain access to everything we offer!

Learn More

Divi Tutorials On YouTube

Our videos have views! Join subscribers and enjoy over video tutorials!

Visit Our Channel

Recent Posts

Pin It on Pinterest

0

Your Cart