I’ve encountered a persistent issue that I’m hoping to get some insights on. When designing and previewing my website in Webflow’s phone viewport, everything appears as intended. However, when I test the site on an actual mobile device, the display doesn’t match what I see in Webflow’s preview. This discrepancy is making it difficult to ensure a consistent user experience across devices.
Additionally, there’s an unexpected behavior with the bottom bar on mobile browsers. Despite designing for a vertical scroll, the bottom bar seems to initiate a horizontal scroll. This not only affects the visual appeal but also the site’s usability on mobile devices.
Has anyone else faced these issues? I’m looking for advice on how to:
- Align the Webflow phone viewport preview more closely with the actual display on mobile devices.
- Prevent the bottom bar from causing horizontal scrolling on the website when viewed on a phone.
Any tips, tricks, or insights would be greatly appreciated. Thank you in advance for your help and support!
here is my website link to view from your phone: OASIS
and I’ve also left a picture and my read only link below.
Here is my site Read-Only: https://preview.webflow.com/preview/andres-portfolio-e355d4?utm_medium=preview_link&utm_source=designer&utm_content=andres-portfolio-e355d4&preview=43648fcfee9889d28e69e1e764baa1ef&pageId=65bd81dd7f5edc2f323befb8&workflow=preview
(how to share your site Read-Only link)