Scaling Issue with a Simple Home Page

Hey guys,

I made a pretty simple home and about page and I’m just trying to make sure it scales down as I scale all the way down to mobile. The site looks exactly as I want it in desktop resolution and I understand in Webflow it is beneficial to go from top down and they should scale down automatically, but that’s not happening in my case.

The issue is that as soon as I start scaling down, everything sort of just stacks up on top of each other. In terms of images they leave the page completely and with text it just stacks up on top of each other.

Example: on the home page I have a couple social media icons at the footer, and they are good on desktop but as soon as it scales down to tablet the instagram icon disappears from view, and if you scale down to mobile the background image gets crammed into the left part of the screen, etc. Basically everything goes crazy.

I spent a lot of time trying to fix it on my own through messing with the height and width and margin, reading the forums with people with similar issues, and watching tutorials from Webflow university and other youtube accounts to no avail, so I think the easiest way to get this fixed is to ask for help on here and give you guys access to my site so you can tell me exactly where I’m going wrong. I’m hoping that since my home page is very simple it will be clear what I’m doing wrong and you guys can explain it to me.

I really like Webflow because it gives me a lot of flexibility regarding custom animations but I need to understand this scaling like the back of my hand before I can move forward with my goals.

Thanks for any help.

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

happy to help :slight_smile: Can you provide your read-only link to your project?