Как добавить иконку в input, чтобы она не перекрывала текст и placeholder?

Question

[gooseNjuice ()]

Результат, которого я хочу добиться:

Нагуглил только то, что можно вставить иконку в инпут в качестве фона, но тогда она перекрывается с вводом и плейсхолдером, вот так:

Наведите, пожалуйста, на истинный путь

Comments

[Антон Литвиненко]

Очевидно независимо от способа установки изображения нужно дать инпуту левый паддинг

Answer 1

[Lord_Dantes]

padding-left: 25px;

Comments

[gooseNjuice ()]

Спасибо, это помогло, но почему такого эффекта не было, например, при padding: 15px 40px? Input просто увеличивался в размере, но иконка не сдвигалась. В чем разница?

[Lord_Dantes]

gooseNjuice (),

padding: 15px(сверх и снизу 15пх) 40px(слева и справа 40пх). Почему не работает может быть масса причин.

[gooseNjuice ()]

Lord_Dantes, большое спасибо Вам за помощь