The problem seems to be that the element isn't fixed. While the CSS clearly says that and all other browsers/platforms regard it, Chrome/Android ignores it and treats it like "absolute" instead of "fixed". That would explain the strange "bottom" positioning and the fact that the element scrolls up away with the rest of the page instead of stick to where it belongs.

Additionally the reported window height doesn't update when the URL bar disappears. Even though the window.resize event is triggered at the right time and I can handle it, the reported height remains the same as if the URL bar was still there. (Firefox/Android does it correctly, too.)

Here's a testcase for this. I've kept it as short as possible. Anything that looks unnecessary to you is required by my application.

There are three panels fixed at the left side. The first (red) has "height: 100vh". The second (blue) has "bottom: 0" instead. And the third (green) is resized by a script from the window height, but only on resize events, so not on page load, and it also logs the window height with each resize event.

You can scroll the page up and down.

Watch the three panels do funny dancing. None of this happens anywhere else, nor is it correct.

I've tested it with:
* Chrome 63 on Windows 10 and Android 7.1
* Firefox 57 on Windows 10 and Android 7.1
* Edge 16 on Windows 10
* IE 11 on Windows 10

Deleted: test.html 1.8 KB

test.html 1.8 KB View Download

Here's a clicky version of the test case: https://jsfiddle.net/bsb0arod/

I tested this on linux and could not reproduce. Switching to windows now.

The jsfiddle link doesn't really demonstrate the issue on Android - better to use the attached test case. But I could definitely repro on Android. Requesting a bisect in case this is a regression.

Tested the issue in Android and able to reproduce the issue. Similar behavior is observed since Chrome #50.0.2624.0

Steps Followed:
1. Launched the Chrome Browser.
2. Open the test filed provided in the C#3
3. Observed the following observations:
> User is able to scroll the red box till "end" text is displayed.
> User is not able to scroll till the bottom in the blue box. User an scroll only till 5th 'more' text is displayed, later complete window gets scrolled.

4. However in the latest Canary and Stable the behavior is same for red and blue boxes. User is not able to scroll till 'end' text is displayed.

Chrome versions tested:
50.0.2624.0, 59.0.3030.0, 63.0.3239.111(Stable), 65.0.3322.0(Canary)

OS:
Android 8

Android Devices:
Pixel 

This seems to be a Non-Regression issue as same behavior is seen since M50. Removing 'Needs-Bisect' label and leaving the status as Untriaged for further input's on this issue.

Please navigate to below link for log's and video--
go/chrome-androidlogs/801621

Note: 
Issue is not observed on FireFox mobile version.

This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue.

Sorry for the inconvenience if the bug really should have been left as Available.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot