See example below. The problem I'm hitting in a page I use is that it uses vh units to make sure fixed position dialogs don't exceed the bounds of the viewport. But our toolbars have grown considerably in size with the most recent Chrome release, so now the save/cancel buttons in the dialog are obscured and can only be found by closing the keyboard and scrolling the page to hide all the toolbars, but the page isn't scrollable when dialogs are open.
In either case, I know the behavior of vh is really tricky and there's no good answer really, but we might want to reconsider this in light of Chrome's chrome getting bigger (new bottom toolbar, and password autofill toolbar when the keyboard is open).
http://jsbin.com/cukitoyoqi/edit?html,output
<!DOCTYPE html>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
#fixed {
top: 0;
border: 5px solid grey;
height: calc(100vh - 10px);
position: fixed;
}
</style>
<div id="fixed">
<input id="input">
</div>
<div style="height: 10000px"></div>
<script>
input.focus();
</script>
bokan: I can't figure out what component this should go in, so assigning to you just for the purpose of routing it to the right place as I think you're the last one to think hard about mobile viewports, right?
Comment 1 by bokan@chromium.org
, Sep 11Mergedinto: 700431
Status: Duplicate (was: Untriaged)