css input label 美化

Question

            图片上的输入框怎么搞啊？ 上面还有字，要用绝对定位么？ 但是绝对定位，窗口缩小会不会变形，求前端大神

 <div class="form-group row justify-content-left item">
                  <label class="col-sm-3 col-form-label text-left"><!--<span class="text-danger">*</span> -->{{'page_login.email_or_mobile' | mTranslate}}:</label>
                  <div class="col-sm-8">
                    <input type="text" name="account" class="form-control " ng-class="{'is-valid':isAccountValid==true, 'is-invalid':isAccountValid!=true}" ng-model="searchData.account" placeholder="{{'page_login.email_or_mobile_hint' | mTranslate}}" ng-blur="checkAccount()" required>
                    <div class="valid-feedback" ng-if="isAccountValid==true">
                      {{'page_login.good' | mTranslate}}
                    </div>
                    <div class="invalid-feedback" ng-if="isAccountValid!=true">
                      {{accountMsg}}
                    </div>
                  </div>
                  <div class="col-sm-3"></div>
               </div>

Answer 1

这种效果?
思路问题