• ProBeaver Weekly
    Weekly for all things Beaver

  • Center align mobile Logo image in Beaver Builder theme

    By default, in mobile view of the Beaver Builder theme: logo image appears on the left side and hamburger icon on the right side. However, you may want to show logo image center aligned while keeping menu hamburger floating to the right side. Little CSS magic can make this change easily.

    Before (left aligned logo) vs After (right aligned logo)

    Center align mobile logo beaver theme

    CSS Code to center align logo image

    1. In WordPress dashbaord, go to Appearance > Editor.
    2. Add following code at bottom of style.css file in the Beaver Builder child theme.

    3. Save changes. Make sure you clear website and browser cache to see changes.

    Davinder Singh Kainth

    About Davinder Singh Kainth

    Davinder loves creating and implementing online spaces. He has over a decade of experience reaching corners of: design, development, blogging and SEO. He also create products at SimpleProThemes(.com), WordPress learning at BasicWP(.com) & digital solutions at iGuiding(.com)


    1. Bill Barnes on April 25, 2017 at 5:23 am

      This is great. Thanks for explaining what I was trying to, but with beaver builder specific classes.

    2. Sean Peacock on April 25, 2017 at 5:01 pm

      Thanks Davinder, this came in handy for me just now.

    Leave a Comment

  • Pro Stuff

    for  Beaver Builder

    Pro Styles for Beaver

    Customize Beaver Builder Modules beautifully with pre-made CSS packs


    A premium modern agency template for Beaver Builder users