Material ui 在Appbar的flex中居中按钮

我无法对齐/证明AppBar中的按钮居中。 它看起来像这样（参见）：

如何在引用classes.TopMenuBox的div中对齐内容

谢谢

将

文本对齐：“居中”

添加到您的

顶部菜单框中

：

const useStyles = makeStyles(theme => ({
  // ...

  topMenuBoxes: {
    flex: 1,
    textAlign: "center"
  }
}));

---

您是否尝试过：

alignItems:“居中”

？如果我在工具栏级别这样做，它只会居中所有弹性项，而不是弹性项中的内容（三个按钮）。如果我在物品层面上这么做，什么都不会发生。明白。我实际上是在看AppBar的标准，似乎在项目级别，如果位置在工具栏级别上是相对的，那么中心对齐是有效的。我认为值得一试，以防你想改变你的一些结构

textAlign=“center”

这样做，但它甚至可以将左侧的边栏按钮居中…欢迎。我写这封信是对这个问题的恰当回答。

const useStyles = makeStyles(theme => ({
  root: {
    flexGrow: 1,
  },
  logoSize: {
    marginTop: '30px',
    height: '70px',
  },
  menuButton: {
    [theme.breakpoints.up('md')]: {
      display: 'none',
    },
    marginRight: theme.spacing(2),
  },
  menuText: {
    [theme.breakpoints.down('sm')]: {
      display: "none",
    },
    textTransform: 'none',
  },
  topMenuBoxes: {
    flex: 1,
  },
}));

const useStyles = makeStyles(theme => ({
  // ...

  topMenuBoxes: {
    flex: 1,
    textAlign: "center"
  }
}));