Добавление значков для ввода форм и начало ввода после значка.

Question

Это будет простой вопрос для некоторых из вас, но я не лучший с CSS и стилем, я предпочитаю развитие бэкэнд. В основном я стилизация формы входа, и я хочу, чтобы выглядеть следующим образом:

фон, вход кнопки все хорошо. Simples.

Я использовал некоторый CSS и могу поместить значок на вход, но когда пользователь начинает печатать, он набирает значок. Я хочу, чтобы раздел значка был разделен, и пользователь начинает печатать после зеленой линии.

#password { 

    background-image:url('../images/pw_icon.png'); 
    background-repeat:no-repeat; 
    height: 30px; 
} 

Это CSS, который у меня есть. Я видел это, но не могу найти никаких примеров после нескольких поисков Google.

Может ли кто-нибудь привести меня к примеру или у вас есть несколько слов, чтобы указать мне в правильном направлении?

Answer 1

CSS

#password { 
    background-image:url('../images/pw_icon.png') no-repeat center left; 
    height: 30px; 
    padding-left: 30px; 
} 

Это должно работать для вас.