Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update layout CSS for mobile devices #4674

Open
DKudleichuk opened this issue Nov 25, 2024 · 1 comment
Open

Update layout CSS for mobile devices #4674

DKudleichuk opened this issue Nov 25, 2024 · 1 comment

Comments

@DKudleichuk
Copy link

Description

The current script does not calculate the viewport height correctly on Phones.
Please update following

https://github.com/alvarotrigo/fullPage.js/blob/master/src/css/fullpage.css#L247-L249

from

body:not(.fp-responsive) .fp-overflow{
    max-height: 100vh;
}

to

body:not(.fp-responsive) .fp-overflow{
    max-height: 100vh;
    max-height: 100dvh; /* fix for new browsers */
}
@alvarotrigo
Copy link
Owner

Can you provide some isolated reproduction where we can reproduce the issue?
Notice your concern is only on sections using scrollOverflow.

  • Where are you having issues? Android? iOS?
  • What browsers are you having issues with? Chrome? Safari? Firefox?

This example looks ok to me on iOS:
https://github.com/alvarotrigo/fullPage.js/blob/master/src/js/resize.js#L219

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants