Second Browser Scrollbar flashes while Pro Header is active

Hi!

I have spent a long time trying to troubleshoot and find the culprit but I simply cannot find it.

When the website loads, the layout is shifting due to the second scrollbar that appears briefly. I have three bars and only after removing all three, the layout shift stops. This is on the Page and Shop Header.

Can you please take a look? I think this should not be happening no matter the Settings in the bars.

Thank you!

Hi @Misho,

I have checked the pages where the specific headers are assigned, but unfortunately unable to find the issue you mentioned. Can you please provide any screenshot marked with the issue or any video that helps us to recognize the problem?
Please remember that the double scrollbar appears only if some of the element is taller or similar in height to its container. I would suggest deleting the elements one by one inside the bar till the issue resolves. The last element that resolves the issue is the reason.

Hope it helps.
Thanks

Hi!

Ok! I am not sure if this is my your doing, but now the second scrollbar is permanent. Oh, wait it was permanent and now it is gone again. But it shows up on most reloads.

I have finally managed to pin-point the culprit. It is the new dropdown element:

I have it both for Search and the Cart. Only after removing both (4 in total), the problem goes away.

Thanks!

Hey Misho,

Thanks for providing the details. I was able to replicate the issue on my site so I’m going to post this in our issue tracker. If our development team sees this as a bug, they will most probably release a fix in one of the succeeding updates. Or, they will advise us of the proper setup. Right now, I also don’t see a solution.

1 Like

Hi!

It is not my habit to bump the threads up, but this is pretty important. I have switched to the new dropdown on a few websites, and built an new webshop using them. All the sites have a shifting layout now.

Is there any update on this?

Thanks and sorry for bothering you!

Hello Misho,

It has been already reported to the issue tracker and queued for further investigation by our development team, but regretfully we don’t have any ETA for that currently.

Thanks for understanding

Thanks. Until solved, I have placed this to the Global CSS, ot stop it:

@media screen and (min-width: 768px) {
	html {
    overflow-x: visible !important;
}
}

You’re welcome Misho.

1 Like

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