Is anyone else experiencing issues with their Webflow site not scrolling? I've tested different browsers and still have the same problem. Any help would be appreciated.
TL;DR
- Check that the Body and Page overflow settings are set to Visible and no custom CSS disables scrolling.
- Inspect parent wrappers to ensure overflow isn’t Hidden unnecessarily.
- Review fixed position or 100vh elements that might block scrolling.
- Examine and temporarily remove custom code that could disable scroll behavior.
- Disable any smooth scroll or custom scroll libraries to check for conflicts.
- Test unpublished or backup versions to identify if recent changes caused the issue.
If your Webflow site is not scrolling across multiple browsers, there’s likely a layout, overflow, or custom code issue. Here’s how to troubleshoot it effectively.
1. Check the Body and Page Overflow Settings
- Select the Body (all pages) element in the Navigator.
- Go to the Style panel and check if Overflow is set to Hidden. If so, set it to Visible.
- Also, click on the Page settings (gear icon next to the page name) and ensure there's no custom CSS inside the Inside Head Tag section that forcibly disables scrolling (e.g.,
overflow: hidden;onbodyorhtml).
2. Inspect Parent Wrappers
- Check all top-level sections or divs for overflow settings.
- If you have a full-page wrapper (e.g., a
Page Wrapperdiv), make sure its Overflow is not set to Hidden unless necessary for a specific design behavior.
3. Look for Fixed Position or 100vh Elements
- Elements with Position: Fixed and 100vh height can sometimes block scrolling unintentionally.
- Inspect fixed or full-screen elements that might be covering the page and trapping scroll events.
4. Review Any Custom Code
- If you've embedded custom JavaScript or CSS, check for scripts that:
- Disable scroll (
document.body.style.overflow = 'hidden';) - Lock scroll during modals or animations and don't re-enable it properly
- Temporarily remove or comment out custom code sections and test scrolling again.
5. Remove Smooth Scroll or Custom Scroll Libraries
- Some external scripts (e.g., Locomotive Scroll, SmoothScroll.js) can conflict with Webflow’s native setup.
- If you’re using one, disable it to test if scrolling works normally afterward.
6. Test Unpublished/Backup Versions
- Sometimes publishing issues or newer changes cause unexpected behavior.
- Duplicate your project or revert to a backup version in Webflow to test if the older version scrolls correctly.
Summary
The most common causes for Webflow sites not scrolling include Body overflow: hidden, fixed full-page elements, or custom scripts disabling scrolling. Check your element styles first, scan custom code, and disable any external scroll libraries to isolate the cause. Fixing the overflow settings usually resolves 90% of these issues.