CODEWITHSUNDEEP
javascriptandroidcssreactjsstyled-components
matan3sh
matan3sh

Reputation: 11

How to avoid bouncing up the elements when typing in input at android web

I have a problem that I can not solve, in Android devices when you put text in the input, so due to the appearance of the keyboard, all the elements are popped up - I attached pictures.

How can this problem be solved?

Before After

How can I turn off the default css settings of browsers in Android? Because in iOS it works great

Thank you :)

Upvotes: 1

Views: 168

Answers (1)

snachmsm
snachmsm

Reputation: 19253

Popping up keyboard is resizing Activity by default, thus it has less space so web content also, and it looks like in your case web content still trying to "fill whole space" trying to align to bottom, center etc. - that depends of params set in CSS

Consider preventing this Activity resizing by android:windowSoftInputMode="adjustNothing" line in manifest

<activity 
    android:name="your.package.activity.WebActivity" 
    android:windowSoftInputMode="adjustNothing" 
    ... rest of params

with this line your Activity won't be resized, instead of that keyboard will show up "above" your View (so will cover half of content). you can also try with adjustPan value, for sure not adjustResize. some doc in HERE

Upvotes: 2

Related Questions