如何将行放置在中间反应语义ui

Question

我将如何使用react语义ui网格行将行定位在中间？想知道是否除了增加padding-top直到到达中间之外还有其他方法

<Container>
        <Grid columns={4} divided>
          <Grid.Row>TITLE</Grid.Row>
          <Grid.Row>
            <Grid.Column width={4} color="violet" textAlign="center">
              <h3>Content</h3>
            </Grid.Column>
            <Grid.Column textAlign="center" width={4} color="violet">
              <h3>Content</h3>
            </Grid.Column>
            <Grid.Column textAlign="center" width={4} color="violet">
              <h3>Content</h3>
            </Grid.Column>
            <Grid.Column textAlign="center" width={4} color="violet">
              <h3>Content</h3>
            </Grid.Column>
          </Grid.Row>
        </Grid>
      </Container>

Answer 1

您可以使用verticalAlign prop并向middle提供值Grid.Row以解决您的问题。另外，请确保为网格提供高度。

根据文档：

网格可以指定其垂直对齐方式，以使其所有列垂直居中。