How to align to ion-label to center?

Ionic Framework ionic-v3
1

Can we align the ion-label to the center? and how?

Assuming below is the code:

<ion-row center>
    <ion-col width-50 center>
      <ion-label>
        Information
      </ion-label>
    </ion-col>
    <ion-col width-50 center>
      <ion-label>
        Testing
      </ion-label>
    </ion-col>
  </ion-row>
2

You should take a look at our docs, we go over some of the utility attributes you can use.

2 Likes
3

Does the text-center align elements? I want to center a label (element) within a row:

<ion-row>
          <ion-col width-50>
            <ion-label left (click)="something()">
            </ion-label>
        </ion-col>
</ion-row>
4

In css:
display: flex; for the parent
margin: auto; for label
Magic!

8 Likes
5

It’s slightly confusing, but I found out that the CSS “text-center” works for non-text items as well.

3 Likes