Как мне разместить значок Fontawesome версии 5 внутри элемента ввода?

Поскольку я использую Font Awesome версии 5, у меня проблема со значками внутри элемента ввода. Он отображается только за пределами текстового элемента ввода.

Изображение того, что я имею в виду Я хочу, чтобы значок ВНУТРИ текстового поля типа ввода.

Код:

.calendar-label::after {
    content: "\f073";
    font-family: "Font Awesome 5 Solid";
	  display: none;
	  position: absolute;
}
<head>

<script>
  FontAwesomeConfig = { searchPseudoElements: true };
</script>

<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>

</head>

<body>

<label class="calendar-label">
	  <input type="text" name="datum">
</label>

</body>


person Bas Verhagen    schedule 12.03.2018    source источник
comment
как я уже говорил вам, используйте отрицательную маржу, и вы получите ее внутри ... или обратитесь к другому вопросу, чтобы узнать о других способах jsfiddle.net/2bzg1Lwj/1   -  person Temani Afif    schedule 12.03.2018
comment
Отрицательная маржа не является решением, когда вводимые данные становятся меньше. И это не дубликат существующих вопросов, потому что версия 5 значков fontawesome полностью отличается от более ранних версий. Это проблема.   -  person Bas Verhagen    schedule 12.03.2018
comment
покажите мне, что отрицательная маржа не является решением, когда ввод становится меньше   -  person Temani Afif    schedule 12.03.2018
comment
Думаю, работает! Спасибо за ответ.   -  person Bas Verhagen    schedule 13.03.2018