Как поместить галочку внутрь инпута?

Question

[sergey19940808]

В инпут нужно поместить галочку, знаю как это сделать с помощью абсолютного позиционирования, но можно ли как-то сделать чтоб элемент был внутри блока инпут?

<input 
    type='text' 
    value={this.state.value} 
    onChange={this.changeValue}
    className='input-field__input fz-small'
    autoFocus
/>
<label className='input-field__success'></label>
<label className='input-field__cancel'></label>

.input-field {
    &__input {
        width: 500px;
        height: 30px;
    }

    &__input + &__success:before {
        content: '\f14a';
        margin: 0 5px 0 0;
        position: absolute;
        top: 34px;
        left: 660px;
    }

    &__success + &__cancel:before {
        content: '\f2d3';
        position: absolute;
        top: 34px;
        left: 700px;
    }

}

Answer 1

[Дмитрий]

Пример

или делать для input контейнер, к которому задаем псевдоэлементы