My Navbar on tablet and mobile screen is overflowing, It was working fine and then all of a sudden it gives me a horizontal scroll

[Scientistx]

I’m a designer and I need this sorted by today because of the May 1 reboot. Please help.

I’ve tried using the chrome developer window to debug it and see what’s the problem, but I can’t find it. On the webflow designer it is perfectly fine.

---

Here is my public share link: https://preview.webflow.com/preview/scientist-x-designs?preview=41f4afc50d88169acc6b39e5181a94a4
http://scientist-x-designs.webflow.io/

[cyberdave (Dave S.)]

Hi there @Scientistx, thanks for the post. Looks like there are some interactions that have an initial appearance where the element is moved off the page or offset from it’s original position.

When doing this, also set the element to have Display none set on initial appearance, so that the element does not create additional whitespace (which causes the overflow).

In the intial appearance, also add display none:

And in the interaction add a first step to set the element back to it’s normal display inline block:

Do this same thing with every interaction that has an initial appearance, causing some element to be off the body at page load. For those elements, keep them set at Display none until the interaction is triggered to avoid the whitespace on load.

I hope this helps.

[Scientistx]

Thankyou so much @cyberdave