Hey, so I’ve been at this for a few days and while I think my website looks nice on Desktop and tablet it is having some trouble translating to mobile. I decided to make the mobile version more simple than the desktop version. For the most part it’s working but the one thing that I can’t seem to get right at all is the background gradient.
I have a CSS gradient in the desktop version that was repeating in mobile when scrolling which looked really bad. I thought maybe if I make the gradient in photoshop and then drop it in as a background image set to cover and fixed (with no tiling) that this would help. I figured the background would fit a phone size and then you could scroll through the content while the background remained fixed.
What I found instead is that as you scroll down you scroll PAST the background into white space. This looks even worse than a repeating CSS gradient.
Any tips here?
EDIT: Forgot to add that the mobile preview in the webflow editor looks nothing like how it does on a real phone. In webflow it looks like the scrolling is acting correctly for mobile, but not so on a real phone. I published to web to check it on my Android.
Here is my public share link: LINK
(how to access public share link)