Mobile headers position issue

Support
#1

Hello guys, i have an issue on a dev site i’m building.
basically i wanted to create a sticky header on both the desktop and mobile versions of the site. i did so by creating 3 different bars.

the first bar would serve its purpose on all viewpoints of 450px+ and the second + third bars would be visible only on small screens (up to 440px).

both have the sticky menu option enabled which is basically the issue here. how could i fix this issue?

Thanks in advance!

#2

Hi,

Thanks for writing in! Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

#3

Hi there, i sent you the link to the site (credentials) in private in the last post. I can SHOW you what i’m talking about, though. here, take a look at it: http://prntscr.com/fusrfd

as you can see, when you switch to the mobile view for small screens, the toolbar just seems to get below the main one (which is visible on almost all devices but on small screens) i remember there was some sort of fix for this but it was on the old forum, which i can’t find anymore :frowning:

if you want to see the problem in action just scroll up and access the site on a small screen device or on a resized browser window :slight_smile:

#4

Hi,

Have you managed to fix the issue? I could not replicate on the browser or the header builder.

If nothing, please let us know which browser you are using while experiencing the issue.

Thank you

#5

Hello, nope, it’s still there, i’m attachinga video of what happens. i’d gladly send out a copy of my configuration but there seems to be no way of doing this witth PRO :frowning: (i can’t export the configuration as i could with X).

here’s the video with the issue: https://www.useloom.com/share/c166e0291f9c4af79c78cda8784aad88

as you can see the “big screens” bar is still there even though it’s invisible.
you can access my site if you want and see for yourself what’s going on.

#6

Hi There,

Thank you for the video. Unfortunately, this is a known bug/issue. You can check it here: https://theme.co/apex/forum/t/troubleshooting-pro-known-issues/203. We’re sorry for the inconvenience this has caused you. You can check our changelog here for status update: https://theme.co/changelog/

#7

yep, in fact one of the support guys actually gave me the fix but that was back then when the old support forum was still active, i can’t find it anymore and i don’t remember how to fix it :(, it’s nothing THAT serious so i can live with it in the meantime, if there’s no workaround in there, if there is some workaround feel free to share :slight_smile:

#8

Hi,

As a work around, you can add this in Header > CSS

.mobile-header {
   top:0 !important;
   position:fixed;
   width:100%;
   z-index:99999;
}

Hope that helps.

#9

unfortunately it doesn’t work. i’ll just leave it as a static header for now until a final solution is reached.

#10

Ok then. Feel free to visit our changelog. That is where we lists all the details of the update: https://theme.co/changelog/

#11

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.