Background color in excess on Mobile view

Hello,

I’m need to help for this.

On mobile screen I have this excess background color and I don’t figured out how it’s possibile. Any advice to solve this?

Niccolò.


Here is my site Read-Only: https://preview.webflow.com/preview/fatfatfatfestival?preview=4d9fa7ed305cc12187c2b396c914b526

Preview link: fatfatfatfestival.webflow.io

which page of your website is it ?

Hello @anthonysalamin. It’s the homepage but seems like has effect all pages. Probably it’s a problem connect to NavBar

It seems fine to me, I can’t see the picture that you have on your screenshot though.
I sometimes had extra margin exactely like you, filled with background color of the body when some of my div’s width / float property were not set properly.

No men, it’s the page rename it as “Home”. Sorry about the confusion is here. Anyway it’s the same as the parallax effect illustration as the first image I’ve uploaded.

Hi @niccolomiranda it looks like your body element is set to overflow: hidden which is causing the odd behavior:

CloudApp

Also your Hero Section is set to 2500px tall, maybe try setting it to 100vh to cover the full viewport height instead:
CloudApp

You may also want to consider changing your scroll interaction for the navbar to be set to a page scroll interaction to make the nav come down when you scroll up, and go up when you scroll down with a “Page Scroll” interaction instead of an active scroll animation:

CloudApp

3 Likes

Thank you so much Waldo! You’re the best!

1 Like