Header not showing up in correct place on mobile, works everywhere else

[davidgaiz]

Hi there,

I recently switched from X to Pro and configured new headers (davidgaiz.com). Everything is working great except for my mobile version. I’ve checked all of my options and settings and can’t figure out why the header isn’t showing up at the top of the page on mobile.

I have the header set to be transparent initially, and have that bar disappear and a solid bar load on a delay. The initial bar is fine, but the solid bar shows up part way down the page.

Any help would be appreciated, thank you!
Dave

[Prasant]

Hello @davidgaiz,

Thanks for asking.

I checked the website and on my end header is loading perfectly fine. Please see screenshot. I suggest you to please clear browser cache and try loading again. https://screencast.com/t/0saHR3ho

Thanks.

[davidgaiz]

Hi @Prasant,

Thanks for the reply. As mentioned above, and shown in your screen shot, the header does load fine initially. If you scroll down, that’s when the problems happen and the header is no longer up at the top. Can you scroll and take a look again and see if you can provide a suggestion for how to fix it?

Thanks,
Dave

[paul.r]

Hi Dave,

I went ahead and added the code below in Header CSS to fix it in mobile.

@media ( max-width: 767px ) {
.my-main-bar {
   top:0!important;
}

.admin-bar .my-main-bar {
   top:46px !important;
}
}

Kindly check in your end.

[davidgaiz]

@paul.r you rock! Thank you for the help!

Any idea on how to change the color of the collapsed nav on the mobile? Right now the 3 dots are blue, I didn’t see settings for changing that color anywhere in the header builder but I may have just missed it. Is there a toggle for it in the builder or does it require CSS? (looking to change it to white)

[lely]

Hi Dave,

Change it here:

Hope this helps

[davidgaiz]

Hi @Lely,

Thanks for the help. I tried that but it didn’t change the color of the dots of the collapsed nav on mobile. Is there some CSS I can use to specifically target the collapsed nav color for mobile?

Thanks!
Dave

[jade]

Hi Dave,

It should be on Layout > Navigation Collapsed > Toggle > Graphic > Graphic Toggle > Color.

Hope this helps.

[davidgaiz]

Thanks @Jade

[paul.r]

On behalf of my colleague, you’re welcome. Cheers!