HTML Problem mit der Cursorposition in Chrome, wenn der Wert leer ist

or kurzem habe ich festgestellt, dass Texteingaben in Google Chrome Probleme mit der Anzeige haben, aber nur, wenn der Text leer ist.

Beachten Sie, dass der Cursor im oberen Bild bei leerer Eingabe in der Texteingabe zu hoch ist.

Aber sobald wir einen Text eingegeben haben, korrigiert er sich selbst:

JSFiddle um zu veranschaulichen. Möglicherweise ist die Google Chrome-Version erforderlich: 38.0.2125.101 m

HTML:

<input name="tb_password" type="password" id="tb_password" class=" validate[required,custom[password]]" placeholder="Type your password here" autocomplete="off" style="
    margin: 0;
    line-height: 46px;
">

CSS:

input[type="text"], input[type="password"] {
width: 100%;
height: 46px;
line-height: 46px;
font-size: 11pt;
color: #555 !important;
text-indent: 15px;
border-top: solid 1px #c5c5c5;
border-left: solid 1px #c5c5c5;
border-bottom: solid 1px #dadada;
border-right: solid 1px #dadada;
background: #fff;
-webkit-box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, .1);
box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, .1);
}

Antworten auf die Frage(8)

Ihre Antwort auf die Frage