Tag text displays as a watermark in the input form (HTC EVO)

I am having a problem with the content being labelautomatically inserted as a watermark inside input. I tested this on a number of phones and browsers, but it seems to only happen on HTC EVO (3D X515A). When I give focus (for example, touching the input), the text disappears, similar to the attribute placeholderfor input. Also there is no autopopulation with js.

I tried searching to find out if this is the new standard for Android browsers, but came up with only one link to a problem that was closed a year ago without a solution: https://github.com/jquery/jquery-mobile/issues/382

Here is the shortcut and input code:

<input type="number" name="phone" id="phone" minlength="10" maxlength="10" inputmode="latin digits" required="required" />
<label for="phone">Confirm your Valid Cell Number:</label>

I will need to take a screenshot of the phone if someone needs to see the problem because this does not happen on my emulator.


UPDATE: removing the input id on the shortcut (for = "phone") solves the problem, but is not syntactically correct. This seems to be a weird bug or โ€œfeatureโ€ in HTC browsers.

HTC. css. , ( ). : focus -webkit , . question . , div.

+5
2

, :

<label for="phone">



Confirm your Valid Cell Number:</label>
<input type="number" name="phone" id="phone" minlength="10" maxlength="10" inputmode="latin digits" required="required" />

( ) . / !

+3

, css

-webkit-user-modify: read-write-plaintext-only;
+3

All Articles