angular - 将 matSuffix 内容与 mat-form-field 输入中的文本对齐

Question

我有一个带有 <span>💡</span> 的 mat-form-field作为 matSuffix

<mat-form-field appearance="outline">
  <input matInput
    placeholder="Details"
    name="details"
    required />
  <span matSuffix>💡</span>
</mat-form-field>

emigi 与文本不对齐的问题



任何想法如何解决？

Answer 1

使用 DIV 并尝试调整图标的位置以补偿默认字体大小 16px 和标准 mat-icon 后缀大小 24px 之间的差异:

<div matSuffix style="position: relative; bottom: 8px;">💡</div>