Textbox style crashes on android devices in app with Sencha

I'm having trouble with the default Sencha style (or Android not sure) for input and password text fields, it works fine on iOS devices and some Android devices, but HTC and others create their own horrible default style (white background and gray border) which I cannot change or hide. Because of this, the whole layout looks very awful .... see image please. Even the Sencha Touch sample has the same problem. please see the second image here . Please if you have any idea what is the reason for this or how you can hide it i would be very grateful !! here is all i tried for this

input { 
background: transparent !important; 
border: 0 transparent !important; 
-webkit-appearance: none; 
} 
input[type=text] { 
background: transparent !important; 
border: 0 transparent !important; 
-webkit-appearance: none; 
}
input:focus{ 
outline:none; 
background: transparent !important; 
border-color: transparent !important; 
-webkit-focus-ring-color: transparent; 
-webkit-appearance: none; 
} 

      

Thanks in advance Andrey

+3


source to share


1 answer


What you are seeing is actually an Android "function" that generates its own control on top of the input field you enter.

If you try to move your focus field, you can see that the field is intact, try the following css rule to see the phenomena:

input:focus {
    position: absolute;
    left: -20px;
}

      



What you can do is try to install -webkit-user-modify: read-write-plaintext-only;

which works on some phones (not sure about <2.3) but may break some functionality. For example. for a numbered field, you still get a qwerty keyboard instead of a numeric keypad, etc.

So try it, hope it helps you and suits your needs.

0


source







All Articles