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 top-level elements for
overflow: hiddenand change tovisibleorauto. - Review sections with
100vh, add content beyond the fold to test scroll, and inspect for full-page fixed elements. - Examine custom code for scroll-blocking CSS or JavaScript and temporarily remove to identify issues.
- Test both Webflow Preview and published site to isolate the problem.
- Use browser DevTools to check for console errors that may impact scroll behavior.
If your Webflow site isn’t scrolling, even across multiple browsers, it’s likely due to either a style or layout issue that’s restricting scroll behavior. Here’s how to troubleshoot and fix it.
1. Check for Overflow Settings
- Select the Body, HTML, or Main Wrapper in your Navigator.
- In the Style panel, look at the Overflow setting under the Layout section.
- If Overflow: Hidden is applied to
<body>,<html>, or a main wrapper (like a full-pagediv), that can block scrolling. - Set it to Overflow: Visible or Auto to restore normal scroll behavior.
2. Inspect Fixed or 100vh Sections
- If you’ve set a section to 100vh (100% of the viewport height), and there’s no content beyond that, the page may appear unscrollable even though it's functioning correctly.
- Consider whether there's additional content below the fold. Add extra content temporarily to test whether the page can scroll.
- Double-check for fixed-position elements that might be covering the entire page without allowing interaction.
3. Review Custom Code
- Go to Page Settings or Project Settings > Custom Code and look for any custom JavaScript or CSS.
- Look for lines like
overflow: hiddenor scripts that manipulate scroll position or behavior. - If found, comment it out or temporarily remove it to see if the issue resolves.
4. Test in Webflow Preview and Published Versions
- Use both Preview Mode inside the Webflow Designer and the published URL to test scrolling.
- Sometimes a scroll issue doesn’t appear in Webflow but does after publishing — or vice versa. This can help hone in on whether it's a designer configuration or a live-site issue.
5. Browser Console Warnings or Errors
- In Chrome or Firefox, Open DevTools (F12) and look at the Console tab to check for JavaScript errors.
- Some errors may stop scripts from executing correctly, affecting scroll or other interactions.
Summary
Your Webflow site likely isn’t scrolling due to hidden overflow styles, 100vh layout blocks, or custom code disabling scroll. Check these areas starting from your top-level containers and fix any layout properties that override normal scrolling.
