Search code examples
ionic4

Ionic 3 ion-title cannot align center

I use Ionic 3, below the code cannot align the title to center, it moves a little bit right due to the ion-buttons. How can it be solved?

<ion-header>
  <ion-toolbar color="primary">
    <ion-buttons slot="start">
      <ion-button (click)="close()">
        <ion-icon name="arrow-back"></ion-icon>
      </ion-button>
    </ion-buttons>
    <ion-title text-center>{{bookName}}</ion-title>
</ion-toolbar>
</ion-header>
Solution

  • You could try to wrap your title in a div like this:

    <div text-center>
    <ion-title>YOUR TITLE</ion-title>
</div>