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.
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.
Hello, Ana! I apologize for only giving a possible solution now. I had the same problem and when searching the forum, I found some solutions that I didn't find very practical... I ended up developing my own and I found it very simple:To remove the focus from the input, I created a local variable and assigned it to the input's Enable boolean, then I just played it in my logic, setting the moment I want it to lose focus, setting enabled to false and then making it true. This worked for me and I hope it works for you.See ya!