双边底垫输入角度

Question

我使用Angular 4.4和Material Design来开发后台，我在几种形式上看到了一些非常奇怪的东西。我拍了一张截图，因为很难解释。它就像一个双边底部，但是当我使用Chrome的检查员时，我没有发现问题。

<mat-input-container class="form-input">
  <input matInput name="firstname" maxlength="255" placeholder="{{ 'user.form.fields.firstname' | translate }}" required [(ngModel)]="currentUser.firstname" />
</mat-input-container>

<mat-input-container class="form-input"> <input matInput type="text" name="lastname" required [(ngModel)]="currentUser.lastname" placeholder="{{ 'user.form.fields.lastname' | translate }}">
</mat-input-container>

<mat-input-container class="form-input"> <input matInput type="email" name="email" required [(ngModel)]="currentUser.email" placeholder="{{ 'user.form.fields.email' | translate }}">
</mat-input-container>

有没有想过要避免这个CSS？

Answer 1

您可以添加height: 0，它应该正确恢复边框。我的猜测是他们忘了将其包含在input[type="email"]

中