Persistent empty space below footer on iOS (iPhone) across multiple sites

Support
#1

Hello Themeco Team,
I am experiencing a recurring issue across several websites built with Pro/Cornerstone. On real iOS devices (iPhone/Chrome), there is a significant empty space (approx. 300px - 500px) appearing below the footer.

The details:

  • The issue does not appear in the browser’s responsive preview or on Android; it is specific to physical iPhones.
  • The space is in the background color of the site/body.
  • I am using several sections with height: 100vh .
  • A JS check reveals that document.body.scrollHeight is significantly larger than the combined height of all sections and the footer (difference e.g. around 305px).
  • Using overscroll-behavior: none or overflow: hidden on .x-site did not resolve the “ghost scrolling” into this empty area.
  • The issue persists even on simple pages.

It seems like a calculation error between the iOS dynamic viewport and the Pro-Framework container logic. Is there a recommended way to force the container to end strictly at the footer, or a specific CSS fix to prevent the body from expanding on iOS?

I would appreciate any insights or a global fix for this.

Best regards
Daryl

IMG_2062
IMG_20621179×2280 41 KB

#2

Hey Daryl,

Please duplicate your homepage. In the Intro Section, tweak the height of the Column.

From this:
image

Into this:
image

Setting the height to 100vh limits the height compared to using the minimum height.

Kindly let us know how it goes.