Sunday, 24 November 2019

Ionic Framework Center button within ionic item

I am using the ionic framework. The following code makes the buttons align left. I would like to make the buttons align center. How can I do that? Thanks
<ion-list>    
  <ion-item><button ion-button (click)="gotoPage1();">Go page 1</button></ion-item>
  <ion-item><button ion-button (click)="gotoPage2()">Go page 2</button></ion-item>
  <ion-item><button ion-button (click)="gotoPage3()">Go page 3</button></ion-item>
</ion-list>

Ionic provides a set of utility attributes that can be used on any element in order to modify the text or adjust the padding or margin.
Use this Center button within ionic item

<ion-list >    
  <ion-item  text-center ><button ion-button (click)="gotoPage1(); ">Go page 1</button></ion-item>
  <ion-item text-center><button ion-button (click)="gotoPage2()">Go page 2</button></ion-item>
  <ion-item text-center><button ion-button (click)="gotoPage3()">Go page 3</button></ion-item>
</ion-list>
Best Ionic Framework Questions answers


Ionic is an open-source, front-end SDK for developing Hybrid Mobile Applications using a web. Web technology-based components as well as native APIs using Cordova and Ionic Native

No comments:

Post a Comment