在 Material UI 网格中垂直居中对齐按钮

Question

我想在这个网格中垂直居中对齐按钮。我试过垂直对齐，但没有效果。我可以使用top: "30%" 调整按钮的垂直位置，但我认为这不是使按钮居中的最佳方式。

<form className={classes.container} noValidate autoComplete="off">
  <Grid container spacing={1}>
    <Grid item xs={5}>
      <TextField
        id="standard-name"
        label="AWS account"
        className={classes.textField}
        margin="normal"
      />
    </Grid>
    <Grid item xs={7}>
      <Button variant="contained" color="primary" className={classes.button}>
        Link AWS account
      </Button>
    </Grid>
  </Grid>
</form>;

Answer 1

这是您需要的 Grid API 。使用 center 值支持 alignItems。阅读 CSS 中的 flexbox 并始终先查看文档。