@Jawell

Как сделать такой label в качестве placeolder?

Здравствуйте, хотелось бы узнать как можно сделать такой input text ?
425a9bc9140a4e8ea76ea45ad3a9f43c.PNG
Т.е. как сделать так, чтобы когда был фокус на input, "PHONE NO" не стерось, и текст начал писаться на против этой надписи ?
Если можно, то пожалуйста код :)
  • Вопрос задан
  • 272 просмотра
Решения вопроса 1
Stalker_RED
@Stalker_RED
<label for="">
  <span>Phone No.:</span>
  <input type="text">
</label>

label {
  position: relative;
}
label input {
  padding-left: 6em; /* в инпуте отступ слева */
}
label span {
  position: absolute; /* приподнимаем надпись над инпутом */
  left: 0;
  color: gray;
  pointer-events: none; /* делаем ее "прозрачной" для кликов */
}
https://jsfiddle.net/d6sv7gnn/
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы