ionic-framework - 并排输入的离子标签，对齐标签右侧

Question

我正在使用 Ionic 5 并且有一些带有输入的标签，其中标签位于左侧，输入位于标签旁边。

这是代码：

  <div id="container">
    <ion-item>
      <ion-label>Label 1</ion-label>
      <ion-input placeholder="something here"></ion-input>
    </ion-item>

    <ion-item>
      <ion-label>Another Label</ion-label>
      <ion-input placeholder="something here"></ion-input>
    </ion-item>

    <ion-item>
      <ion-label>Third Label</ion-label>
      <ion-input placeholder="something here"></ion-input>
    </ion-item>
  </div>

正如您在上面看到的，标签的大小不同。

如何使标签的右侧对齐？

Answer 1

将此添加到您的 scss 中并且应该可以工作：

ion-item > ion-label{
    flex: content;
}