Ionic - ion-item text is not vertically centered when ion-icon is bigger : <p>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 the ion-item. But when the icon is bigger, the alignment is a bit off. </p>

<p><a href="https://i.stack.imgur.com/efZu7.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/efZu7.jpg" alt="enter image description here"></a></p>

<p>This is all I've added:</p>

<pre><code>&lt;ion-item&gt;
  &lt;ion-icon class="icon ion-ios-clock-outline"&gt;&lt;/ion-icon&gt; 
  Recent
&lt;/ion-item&gt;
</code></pre>

<p>And the CSS:</p>

<pre><code>.icon {
 font-size: 35px;
 color: #ffC977;
}
</code></pre>

<p>How can I fix this. I tried using <code>vertical-align</code>, <code>align-item</code> and <code>align-self</code>. None of them worked.</p>
