Выровнять кнопку по вертикали по центру в сетке MaterialUI

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 . Prop alignItems со значением center. Прочтите о flexbox в CSS и всегда сначала проверяйте документы.