Cordova 3.4 Android - Focus on input causes div to move / creates a border

Question

Only in Android / Cordova when focusing on an input box, be that a text field or a drop down field the 'view' flickers and once you're focused in on the input the whole screen moves down and right slightly to show a border on left and top side. It also seems to have stretched images out of proportion in other views and its impossible to get the view back to normal after focusing out the input.

I assume the white border is the body at the very back of the page, but I can't determine why this is happening and why some other images are going stretched after this focus.

This doesn't happen on iOS and this is replicable on multiple version of android.

Answer 1

That is because ChromeView adds a border to a focused element (in my case it was orange). When you apply the following line in your CSS to every element in your body, then it should be gone.

outline: none !important;