Ionic - ion-item text is not vertically centered when ion-icon is bigger

Question

I have a list of ion-items with an icon followed by text. When the icon size is smaller as seen on the image below, the text seems to vertically align itself to the center of th

Answer 1

Please update your following CSS Class. Also you can move your text to a label tag and give the vertical-align middle for the label tag as well.

CSS

.icon {
     font-size: 35px;
     color: #ffC977; 
     vertical-align: middle;
    }

    label{ 
      vertical-align: middle;
    }

HTML

   
  Recent