Input has different style on focus [closed]

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly开发者_如何学C broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center. Closed 10 years ago.

I am developing an Android app with Phonegap, but I ran into a problem... Input has a different background, border and shadow on focus (see below). It should be noted that this applies only to input type ‘password’.

How do I fix this? Thanks in advance!

---

The Android-WebKit-Browser seems to add a special overlay box to the input type "password" on focus (I think to apply this special mobile masking where the last letter typed is still visible) which ignores all styling except the "-webkit-tap-highlight-color" property.

So you will be out of luck styling these input boxes. Btw. styling of input boxes doesn't work at all on devices with HTC Sense, have a look here:

Input-Elements in WebViews always have the same style if highlighted on HTC Devices

Oh, one exception: the stylings seem to work on samsung devices (at least on Galaxy S and I5800)

---

we ran into an issue on HTC devices where CSS3 transitions would cause a "double password" box being displayed whenever a form was being displayed over the animations.

Basically the Android-created overlay would be drawn in the bottom of the screen, irrespective of where the actual HTML form markup was rendered.

Every time you typed in the password field, Android would update both boxes. Looks horrendous. It usually disappears after the input field loses focus...usually.

Since trying to force a style didn't work, we instead had to make sure the -webkit-backface-visibility was set to '' (instead of 'hidden'). whenever the input form as being shown.

---

You should be able to apply a different style by targeting that input and adding :focus. So for example:

input[type=password]:focus { border-radius: 5px; }

Assuming that the input is of the type password that would give it rounded corners. Then just copy the rest of the styling from the other inputs to match.