Ionic Button center icon and text

Hello,

I need help for something that is making me crazy. I need to center an icon with text into a button. If I could use pure CSS, I can do with Flexbox. But in this case I can’t.
I have tried all the classes reported into the documentation, but it doesn’t work in my case.

 <div class="btn-container">
        <ion-row>
          <ion-col size="6">
            <ion-button size="large" expand="full">
              <ion-icon slot="start" :icon="qrCodeOutline"></ion-icon>
              QR Code
              </ion-button
            >
          </ion-col>

          <ion-col size="6">
            <ion-button size="large" expand="full">
              <ion-icon slot="start" :icon="cardOutline"></ion-icon>  
              ID Card</ion-button
            >
          </ion-col>
        </ion-row>
      </div>

Also, you can see that I have used a workaround to display the icon. Because If I use the code from the documentation, it doesn’t work.
Could anyone help me?

Thanks

1 post - 1 participant

Read full topic