Virtual keyboard resize causes viewport and selection loss
OS: Android 10.0+ · Device: Any Android device Any · Browser: Chrome Mobile 90.0+ · Keyboard: Gboard (Google Keyboard)
Open case →Scenario
Viewport resize when the virtual keyboard opens (Android Chrome)
The visual viewport shrinks when the keyboard appears; fixed toolbars, sticky UI, and caret visibility interact with resize and scroll events differently than desktop.
ui
Scenario ID
scenario-mobile-virtual-keyboard-resize
Details
The visual viewport shrinks when the keyboard appears; fixed toolbars, sticky UI, and caret visibility interact with resize and scroll events differently than desktop.
Related Cases
References
Scenario flow
Visual view of how this scenario connects to its concrete cases and environments. Nodes can be dragged and clicked.
Variants
Each row is a concrete case for this scenario, with a dedicated document and playground.
| Case | OS | Device | Browser | Keyboard | Status |
|---|---|---|---|---|---|
| ce-0218-mobile-keyboard-resize-android-chrome | Android 10.0+ | Any Android device Any | Chrome Mobile 90.0+ | Gboard (Google Keyboard) | draft |
Cases
Open a case to see the detailed description and its dedicated playground.
Related Scenarios
Other scenarios that share similar tags or category.
Tags: mobile, android, keyboard
Software keyboard does not appear when focusing contenteditable
On some mobile browsers, focusing a contenteditable programmatically or from a non-gesture path may not raise the virtual keyboard—users cannot type until they tap again.
1 case
Tags: mobile, android, keyboard
Page scroll when the mobile keyboard opens
Mobile browsers may scroll the page to bring the focused field into view when the virtual keyboard opens—sometimes overscrolling or hiding fixed UI and the caret.
1 case
Tags: keyboard, viewport
IME UI & Experience: Viewports, Candidates, and Layout
Managing browser UI collisions, virtual keyboard resizing, and IME candidate window positioning.
1 case
Tags: keyboard
Caret visibility after scroll on iOS Safari
After the user or the page scrolls while editing in iOS Safari, the caret may render in the wrong place, disappear until the next tap, or sit outside the visible viewport—especially with fixed headers or virtual keyboard resize.
1 case
Category: ui
Caret scrolls out of view during typing
Automatic scroll-to-caret may fail when the editable is inside nested scrollers, overflow hidden ancestors, or during rapid input—the user loses sight of the insertion point without manual scroll.
1 case
Comments & Discussion
Have questions, suggestions, or want to share your experience? Join the discussion below.