Mobile Nav - Centered Logo

[Thomxnj]

Hi,

Im looking to create a mobile nav with a centered logo and right align burger icon. What setting in the nav should be chosen? Any time I choose one of the layouts (centered, space between, etc), and try to add some custom padding or margin, it shifts both elements.

Thanks in advance!

[nabeel]

Hi there,

Thanks for writing around! Please try the following settings:

• For your logo container use the following settings:

• For burger menu container use these settings:

Let us know how this goes!

[Thomxnj]

Hi,

Thanks for your response.

Apologies, on second glance, I didn’t explain the look I was trying to achieve thoroughly.

Im actually trying to have the logo centered horizontally, and the burger icon right aligned horizontally (please see below). Im not sure how to achieve this with the flex layout options.

Thank you!

[friech]

Hi There,

Set the Container’s (where your image is placed) left and right margin to auto that should center the image.

The mobile menu is already on the right, please clarify. If you mean text-align: right; the menu items, please inspect your Navigation Collapse element (mobile menu) and look for the TEXT MARGIN option. Set the left margin to auto and set the right margin to 5px

Cheers!

[Thomxnj]

Hi,

Thanks for you reply.

Im referring to the navigation icon collapse (burger icon), horizontally alined to the right or end, to achieve the layout the image I attached above.

Im not sure what you mean by setting the container left, but also what are the settings to achieve this layout in the “Flex Layout” options of the main mobile nav container?

Thank you!

[rad]

Hi there,

It can’t be done by just changing the flex layout. Please check this video https://www.dropbox.com/s/zqelo0l6ps7qkj8/PRO%20CENTER%20LOGO.mp4?dl=0

You must download the video or better quality.

Hope that helps

[Thomxnj]

You rock- that worked!

Thank you!

[ruenel]

You’re welcome!
We’re glad we were able to help you out.