Search code examples
htmlcssionic4

How to align ion-label in center?

I'm creating ionic 4 angular app, and using ion-label to print some text.I have facing issue with ion-label , i will assign ion-label to center but did not work. which css or ionic pre defined css used ? Below my css code give ...

.User_Label_Section {
  position: fixed;
  display: flex;
  justify-content: center;
  margin-top: 107px;
}

.user_Name {
  display: flex;
  justify-content: center;
  width: 200px;
}
<ion-row class="User_Label_Section">
  <ion-col text-center>
    <ion-label class="user_Name">ABCDEFG</ion-label>
  </ion-col>
</ion-row>

Solution

  • Give width as 100vw to .user_Name class. It will work if you want it to be aligned in centre. The issue is you have fixed the width: 200px and are trying to align the text within it. Then again this will fix the issue with the css part.