CODEWITHSUNDEEP
ionic-framework
user9847788
user9847788

Reputation: 2435

How to centre ionic-icon in Ionic app when ion-text-centre is not working?

I am trying to centre an ion-icon in my Ionic app, I tried to use the ion-text-center class I got from the ionic documentation here, but it's not rendering any change.

Here is my code:

<ion-header [translucent]="true">

    <ion-toolbar color="danger">
        <ion-title>
          Feedly
        </ion-title>
    </ion-toolbar>

</ion-header>

<ion-content [fullscreen]="true">


    <ion-item class="ion-text-center">
        <ion-icon name="logo-rss" class="logo" color="light"></ion-icon>
    </ion-item> 

</ion-content>

Can someone please tell me what I'm doing wrong, & how to resovle this?

Upvotes: 1

Views: 372

Answers (1)

user796446
user796446

Reputation:

This should work for you

      <ion-grid>
        <ion-row>
          <ion-col size="12" text-center>
            <ion-item>
             <ion-icon name="logo-rss"></ion-icon>
            </ion-item>
           </ion-col>
          </ion-row>
        </ion-grid>

Basically you want to use icon grid to control layout and placement within col and rows.

Upvotes: 1

Related Questions