Site wide flash of an extra scroll bar

Hi, see here:

Site wide, when you load, or refresh a page, there is a flash of an extra scroll bar loading:

Its causing a bit of Cumulative Layout Shift too.

I tested with a blank page: https://staging-logoglo-newsite.kinsta.cloud/portfolio-page/ still does it…

I also tested by disabling all plugins, still does it.

Any ideas as to what is causing this?

Thanks.

Hey @Oriol,

Thanks for writing in! Regretfully I was not able to replicate the issue. See the video below.

Hope this helps.

Thanks, but what browser is that in? mine is in chrome…

Hi Oriol,

I am also using chrome, but, unfortunately, didn’t find the issue you are describing here. Can you please mention the device, browser name and version, and also the operating system you are using, that helps us to replicate the issue at our end?

Thanks

The video in the 1st post was on my computer. Windows 10. Latest chrome version. Version 111.0.5563.147 (Official Build) (64-bit).

This was taken on a friends computer, different network, different computer. Windows 11, and latest chrome:

If I build a new page, with nothing in there, and just add padding to allow the scroll bar to appear, there isnt a flash. but on all pages I have designed so far, there is a flash, so the home page, and these:

And

Im re-designing the page, and even older pages that I havent touched, not built in cornerstone has the flash too:

As I said, I disabled all plugins, flushed caches, checked in incognito, but that flash is still happening.

I included login details for you to investigate further. Thanks.

Update. I did a test page without a header or footer. The flash goes away. Then saved the page again, but with header only. No flash.

When I save it with the footer. The flash is there. It has got something to do with the footer.

Hi Oriol,

Glad to know that you are able to narrow down the problem. The double scrollbar appears only if some of the elements are taller or similar in height to their container. I suggest you check by deleting the bar/row of the footer one by one till the issue is fixed, and the last one you have deleted before the fix is the actual issue.

Hope it helps.
Thanks

Hello,

I also find myself with the same kind of issue,
What i usually do (header or footer), is that i put a padding top/bot of 10 to 20px and usually the problem goes away.

Thanks guys, turned out to be the menu…strange though as that’s your standard menu element. I changed it so it wasn’t stacking, and it fixed the error. What should I do if I wanted it stacked though?

Hi Oriol,

I think stacking the menu was not the problem here. As I told you before that it might be a problem with the height, please check the footer and the header for the same.

Thanks

I did, and the only thing that fixed the issue was changing the menu height.

What a relief! Thanks for sharing how you were able to fix your issue.

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