title: How to align horizontal icon and text in MUI
body: <p>I am a newbie in MUI, now my icon and text are not aligned:</p>
  <p><img src="https://i.stack.imgur.com/3PlZc.png" alt="not align" /></p>
  <p>My desired results:</p>
  <p><img src="https://i.stack.imgur.com/cGOw1.png" alt="" /></p>
  <p>My code is:</p>
  <pre><code>&lt;div style={{
      display: 'inline-flex',
      VerticalAlign: 'text-bottom',
      BoxSizing: 'inherit',
      textAlign: 'center',
      AlignItems: 'center'
  }}&gt;
      &lt;LinkIcon className={classes.linkIcon}  /&gt;
      revolve
  &lt;/div&gt;  
  </code></pre>
  <p>I tried grid and row, but not work. Can anyone help me?</p>