CSS - Center align text with icon
<p>Using material icons with CSS, I have the following code that renders a link with icon and text.</p>

<pre><code>&lt;a href="#"&gt;&lt;i class="material-icons"&gt;group_work&lt;/i&gt;Groups&lt;/a&gt;
</code></pre>

<p>As you can see in the image below, the text seems to be sinking down.. I would like them to be vertically aligned center together. How can i achieve this?</p>

<p><a href="https://i.stack.imgur.com/TnplE.png" rel="noreferrer"><img src="https://i.stack.imgur.com/TnplE.png" alt="Icon and Text mis-aliged"></a></p>

<p>PS. (Not a designer!)</p>