This is my first Webflow site, and it looks decent on desktop/tablet/mobile versions in the editor. However, when I publish the site and resize my browser to the narrowest version, some of the elements break (specifically, buttons and one of the headings). I can’t seem to fix this in the editor because it looks fine on all desktop, tablet, and mobile widths. Any idea how I can fix this?
Here’s what I’m talking about
Any advice from Webflow pros would be extremely appreciated. Maybe I’m just missing something in the editor. Cheers
Here is my site Read-Only: Webflow - Chat App Practice
Hi - Quick test at my end and appears to be displaying as expected. What browser are you using for that test video, and have you tested in multiple browsers?
Have you checked your site in an incognito window by chance? I wasn’t able to replicate the same issue you showed in your recording. Also, I checked your site on mobile and it looks all good to me.
I’d recommend giving the following a shot:
- Re-size the window, then reload the site with the browser at the size. Does it still occur?
- Visit your site in an incognito window to check if the same problem occurs. Does it still occur?
- If it works in incognito, try to clear your browser cache to eliminate any conflicting data.
I’ve noticed resizing the Chrome window to mimic a mobile size, it may not always provide an accurate reflection of how your site will appear on real mobile devices. Also, things like Chrome extensions tend to cause these issues.
Give it a shot, & hopefully it resolves.
Hey, sorry for the late reply. I’m going to just roll with it since neither you or Brandon could replicate the issue. Thanks for checking it out!
Thanks for the feedback. I didn’t realize that resizing the Chrome window may not give an accurate depiction of the mobile version. I’ll just ignore it for now, not a big enough issue to stress out about.