嵌套网格元素不在材质 UI 网格中居中

Question

我使用嵌套材质 UI 网格来显示我的 React 组件。问题是我在嵌套网格中有两张名为 practice 和 average 的卡片，但它们没有显示在网格的中心。我已将 alignItems 和 justfiy 属性设置为居中，但它们不起作用。 这是代码示例

 <Grid container spacing={2} justify="center" alignContent="center">
          <Grid item sm={6} xs={12}>
            <Paper className={classes.paper}>
              <h2>Paractice DOJO</h2>
            </Paper>{" "}
          </Grid>
          <Grid item sm={6} xs={12}>
            <Paper className={classes.paper}>
              {" "}
              <h2>Paractice </h2>
//not centring these cards
              <Grid
                container
                item
                spacing={2}
                justify="center"
                alignContent="center"
              >
                <Grid item xs={12} lg={6}>
                  <ParacticeCards />
                </Grid>
                <Grid item xs={12} lg={6}>
                  <Average avg />
                </Grid>
              </Grid>
            </Paper>
          </Grid>
        </Grid>