Webflow sync, pageviews & more.
NEW

How do I remove the white space at the bottom of a site in Webflow on the Gallio theme?

TL;DR
  • Check all bottom sections, containers, and the body for extra margin/padding or hidden elements pushing content.
  • Ensure full viewport-height sections don't overflow, animations don't shift elements, and custom code doesn't add unwanted spacing.

You're seeing white space at the bottom of your Webflow site using the Gallio theme, which is often caused by extra padding/margin, hidden elements, or full-height sections not filling the viewport correctly.

1. Check for Extra Margin or Padding

  • Inspect all sections and containers near the bottom of the page in Webflow Designer.
  • Select the last visible element in the layout and look at its bottom margin or padding in the Style panel.
  • Also inspect the Body element and main layout wrappers for any unnecessary spacing.

2. Inspect Hidden or Overflowing Elements

  • Use the Navigator panel to check for any empty divs or hidden elements below your content.
  • Temporarily make hidden elements visible to ensure they’re not pushing the layout.
  • Delete or reposition any extra elements not meant to be on the live page.

3. Check for Full VH Sections

  • If you’re using a 100vh hero section (or similar), ensure that:
  • There’s no extra spacer or padding below it.
  • No child elements inside are overflowing vertically.
  • Use Overflow: Hidden on containers to fix child content overflow if needed.

4. Review Interactions and Animations

  • In Page Load or Scroll-based interactions, check that no elements are being moved or scaled beyond the visible area as part of an animation.
  • Disable interactions temporarily to test if they're causing white space.

5. Scan Custom Code (if any)

  • Open the Page Settings → Custom Code and also Project Settings → Custom Code tab.
  • Look for scripts or styles that may add spacing (e.g., margin-bottom, padding-bottom, or setting min-height).
  • Remove or edit as needed.

6. Preview on Multiple Devices

  • Use Webflow’s Responsive Preview tools to ensure the space isn’t specific to one breakpoint.
  • Sometimes, spacing issues appear only on tablet/mobile layouts due to layout stacking or different styling.

Summary

To remove the white space at the bottom of your Webflow site using the Gallio theme, inspect for extra bottom margin, padding, or hidden elements in the last section or body. Check for overflow issues from full viewport sections or animations. Review custom code for any min-height or spacing styles. Use responsive preview to confirm consistency across breakpoints.

Rate this answer

Other Webflow Questions