PSK adds extra scrolling on Chrome for Android
rediche opened this issue · comments
Description
When browsing a PSK project in Chrome for Android you can scroll further down than the scrollable area in <app-drawer-layout> causing the entire app to shift out of it's fullbleed position.
This is likely caused by the fact that body has min-height: 100vh; which no longer accounts for the current height of the viewport in Chrome for Android, but rather the "largest possible viewport".
Expected outcome
When hitting the bottom of <app-drawer-layout> the entire layout of the page shouldn't scroll any further.
Actual outcome
When hitting the bottom of the page, you can scroll an additional distance. This scrolling happens on the <body> element.
Steps to reproduce
- Make a new PSK installation.
- Put more content in
my-view1.html, such that text will go over the fold. - Open the page in Chrome on Android (not just an emulated phone on dev tools).
- Scroll down to the bottom in a few swipes.
- Now scroll down even further (this is the body scrolling).
Possible solution
A solution for this problem is to change from min-height: 100vh; to min-height: 100%;. This however seems to cause the address bar to never disappear when scrolling which is also an unwanted result.
Browsers Affected
- Chrome on Android
- Edge
- Firefox
- IE 11
- Safari 8
- Safari 9