Mobile Header Formatting

[JoeScheirich]

Greetings,

I’ve been having a little issue with our new site when using my iphone. The logo and other header elements seem to be on top of each other at the smaller mobile screen sizes, but look fine on my desktop browser.

I’ll send screenshots (both mobile and desktop).

Do you have a suggestion to fix?

Attachments:

You must be logged in to view attached files.

[Harry]

Hi Joe,

Thank you for purchase.

This issue because you runnine header transparent option. You can disable in Theme Option > Header > Header Transparent > Off

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[JoeScheirich]

Thank you, that fixed the overlap.

Is there any way to force the gray top bar to stay a certain size and make it so it doesn’t break, so that the social icons are on one side and the USD is on the other.

See 2 attached screenshots, 2A is the actual screen, 2B is my mockup where the top bar stays on one line.

Thanks for your previous help.

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

You can add custom css in JanStudio > Theme Option > General Layout > Custom CSS

@media only screen and (max-width: 736px) {

.header__top .jas-row .jas-col-md-4.jas-col-sm-6.jas-col-xs-12 { flex-basis: 50%; max-width: 50%; padding-left: 0; padding-right: 0;}

.header__top .jas-row .jas-col-md-4.jas-col-sm-6.jas-col-xs-12.start-md.start-sm.center-xs { -moz-box-pack: start; justify-content: flex-start; text-align: start;}

.header__top .jas-row .jas-col-md-4.jas-col-sm-6.jas-col-xs-12.end-lg.end-sm.center-xs {-moz-box-pack: end; justify-content: flex-end; text-align: end;}

.header__top .jas-socials { padding-top: 0; }

}

Best regards

 

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[JoeScheirich]

Thanks Again… You all are awesome.

Just what I needed.

[Harry]

you’re welcome. Feel free contact us again if you need more help.

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Author]

Posts