iOS keyboard leaves white background after closing (mobile as PWA)
Question
Application Type
Mobile
Service Studio Version
11.10.21 (Build 41765)
Platform Version
11.10.3 (Build 27323)

On our mobile app, published as a PWA, when on Safari iOS, we have this issue whenever a keyboard closes it leaves a white background the size of the keyboard and the view doesn't resize until we change to other screen.

keyboardissue.png

Solution

Hi, can you check if the container element has this css property?

 

If it has, try changing from touch to auto.

See: https://github.com/ionic-team/ionic-framework/issues/4849


Also, to make a div on your page always full-height, use height:100% and “position: fixed”, so that normal CSS sizing will make the components always be the full height despite toolbars and URL bars coming and going. 

See: https://blog.opendigerati.com/the-eccentric-ways-of-ios-safari-with-the-keyboard-b5aa3f34228d


If you still can't seem to fix this issue with just css, you can react to changes to window.innerHeight and force a redraw.


You can also try to use this plugin to react to keyboard visibility:

https://www.outsystems.com/forge/component-overview/2545/cordova-keyboard-plugin


Hope that helps!

Thanks @Luis Amador. It seems the 

body {
    position: fixed;
}

fixed it.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.