Исходный браузер для Android: входной заполнитель работает неправильно

Question

Я столкнулся с одной проблемой в собственном браузере Android. В моем случае у меня есть ввод с текстом-заполнителем. Текст отображается правильно во всех браузерах, но в родном браузере для Android показывает странно:

Как видите, текст не находится по вертикали. Как я могу поместить его по вертикали в середине? Я проверяю на Samsung Galaxy Note 10,1 (android version is 4.1)

HTML:

<input type="text" id="my_input" placeholder="Please enter your password"/> 

---

CSS:

input { 
    border: 3px solid green; 
    height: 43px!important; 
    padding: 0; 
    font-size: 23px; 
} 

EDIT

После добавления line-height (line-height: 43px;) стала она стала хуже

Answer 1

Updated Fiddle

Вы можете сразу использовать Watermark Jquery. Потому что, если вы измените CSS, это создаст проблему в других браузерах.

https://code.google.com/p/jquery-watermark/

$(function() { 
    $("#fname").watermark("First Name"); 
    $("#lname").watermark("Last Name"); 
    $("#company").watermark("Company Name"); 
}); 

Это простой в использовании.

Answer 2

Попробуйте использовать это правило CSS: -

#my_input { line-height: 0; }