使用脈輪界面和css， 我想讓文字在圓圈內(nèi)居中。

這是我所擁有的:

<Td verticalAlign="middle">
 <Grid templateColumns="repeat(3, 1fr)">
  <GridItem colSpan={1} alignSelf="center">
   <Box className={testCss}>6</Box>
  </GridItem>
.
.
.
 </Grid>
</Td>

export const testCss = style({
    width: "15px",
    height: "15px",
    backgroundColor: "blue",
    color: "white",
    borderRadius: "50%",
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
});

這是它看起來的樣子。 (圓圈內(nèi)的數(shù)字不垂直居中)

我已經(jīng)試過了 更改GridItem = & gt display:flex和add set alignItems:& quot；中心& quot和justify content:& quot；中心& quot但這并沒有解決。

有人知道如何解決這個(gè)問題嗎？