如何在MUI中对齐水平图标和文本 [英] How to align horizontal icon and text in MUI

问题描述

我是MUI的新手，现在我的图标和文本不对齐：

我想要的结果：

我的代码是：

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

我尝试了网格和行，但没有工作。有人能帮我吗？

推荐答案

该功能工作正常！

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

这篇关于如何在MUI中对齐水平图标和文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！