如何在 MUI 中对齐水平图标和文本

Question

我是 MUI 的新手，现在我的图标和文字没有对齐：

我想要的结果：

我的代码是：

 <div style={{
    display: 'inline-flex',
    VerticalAlign: 'text-bottom',
    BoxSizing: 'inherit',
    textAlign: 'center',
    AlignItems: 'center'
}}>
    <LinkIcon className={classes.linkIcon}  />
    revolve
</div>

我尝试了网格和行，但不起作用。谁能帮我？

原文由 tong 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这非常有效！

 <div style={{
    display: 'flex',
    alignItems: 'center',
    flexWrap: 'wrap',
}}>
    <LinkIcon />
    <span>revolve</span>
</div>

原文由 Peter Moses 发布，翻译遵循 CC BY-SA 4.0 许可协议