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

fix: set page height to 100% instead of 100vh #21025

Merged
merged 3 commits into from
Mar 13, 2025
Merged

Conversation

vursen
Copy link
Contributor

@vursen vursen commented Feb 21, 2025

Description

The PR modifies the page height from 100vh to 100% to prevent the content area from extending underneath the navbar on mobile devices:

- body, #outlet {
+ html, body, #outlet {
-   height: 100vh;
+   height: 100%;
    width: 100%;
    margin: 0;
  }
height: 100vh height: 100%
Image Image

Fixes #21024

Type of change

  • Bugfix

Copy link

github-actions bot commented Feb 21, 2025

Test Results

1 170 files  ±0  1 170 suites  ±0   1h 15m 37s ⏱️ + 1m 20s
7 785 tests ±0  7 728 ✅ ±0  57 💤 ±0  0 ❌ ±0 
8 145 runs   - 5  8 079 ✅  - 5  66 💤 ±0  0 ❌ ±0 

Results for commit 985d67a. ± Comparison against base commit 4f29383.

♻️ This comment has been updated with latest results.

@vursen vursen marked this pull request as ready for review March 12, 2025 11:48
@vursen vursen requested review from mshabarov and web-padawan March 13, 2025 07:34
@mshabarov mshabarov enabled auto-merge (squash) March 13, 2025 11:55
@mshabarov mshabarov merged commit d6af1c8 into main Mar 13, 2025
25 of 26 checks passed
@mshabarov mshabarov deleted the set-page-height-to-100% branch March 13, 2025 12:09
vaadin-bot pushed a commit that referenced this pull request Mar 13, 2025
The PR modifies the page height from 100vh to 100% to prevent the content area from extending underneath the navbar on mobile devices:

- body, #outlet {
+ html, body, #outlet {
-   height: 100vh;
+   height: 100%;
    width: 100%;
    margin: 0;
  }
vaadin-bot added a commit that referenced this pull request Mar 14, 2025
The PR modifies the page height from 100vh to 100% to prevent the content area from extending underneath the navbar on mobile devices:

- body, #outlet {
+ html, body, #outlet {
-   height: 100vh;
+   height: 100%;
    width: 100%;
    margin: 0;
  }

Co-authored-by: Sergey Vinogradov <[email protected]>
@vaadin-bot
Copy link
Collaborator

This ticket/PR has been released with Vaadin 24.8.0.alpha2 and is also targeting the upcoming stable 24.8.0 version.

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

Successfully merging this pull request may close these issues.

Content area extends under navbar on iOS due to page height 100vh
4 participants