Mobile Logo Centered and Spacing

[danwedin]

I’ve looked through and tried several posts on centering the logo only on mobile and nothing is working for me.

I’m trying to center the logo and click to call on the page below. And also to add a margin in between them on mobile. I can add space but it always pushes the logo up and I’ve tried to increase the height of the bar or allow it to be flexible but can’t get that to work either.

http://vistaequipment.site/landing-page/

Thank you for your help.

[ruenel]

Hello @danwedin,

Thanks for writing in!

Please edit your custom header and in your Container > Flexbox, set the “Direction” to Center in select screen sizes.

You also need to change the Horizontal Alignment in smaller screens:

You can do all this with the help of the Responsive Element Styling. Please check out this documentation to know more about it:

• https://theme.co/docs/responsive-styling

Best Regards.

[danwedin]

Ok that worked. Thank you! I didn’t realize you clicked on the actual words to pull up that box to adjust for each screen size.

[danwedin]

How would I make the actual header height in mobile increase to push the content down?

I can open a new topic just let me know.

[ruenel]

Hello @danwedin,

You need to set the height of your Bar element to auto.

Hope this helps.

[danwedin]

It worked perfectly, thanks!

[tristup]

Hi @danwedin,

Glad that we are able to help you.

Thanks