首页 > 解决方案 > ion-text-center 不将 ion-item 中的内容居中

问题描述

 <ion-item lines="none" class="ion-text-center">
      <ion-avatar slot="start" *ngFor="let mId of headerMemberIds;let i = index" class="member-{{i}}">
        <img [src]="profilePhotoUrl$[mId] | async">
      </ion-avatar>
      <ion-avatar slot="start" class="avatar" *ngIf="allMemberIds?.length>3">
        <div class="remaining-members">+{{allMemberIds?.length-2}}</div>
      </ion-avatar>
    </ion-item>

关于如何将内容集中在ion-item上面的用例中,当然还有我的用例的任何线索?

在浏览器上生成的 css

.ion-text-center, [text-center] {
    text-align: center !important;
}

标签: htmlcssangularionic4

解决方案


您应该使用 class="text-center" 并像这样定义类:

.text-center {
  text-align: center;
}


推荐阅读