Css 如何删除表格单元格中的顶部填充

下面是render函数中的样式和表格

const style = theme => ({

table: {
    maxHeight: '90vh',
},

tableCell: {
    textAlign: 'center',
    border: "solid",
    borderColor: '#000',
    borderWidth: 1,
    padding: 0,
}

})


<TableContainer component={Paper}>
            <Table className={classes.table} aria-label="simple table">
                <TableBody>
                    <TableRow>
                        <TableCell colSpan={2} className={classes.tableCell}>
                            {
                                this.getOilIndicator(data)
                            }
                        </TableCell>

const style=theme=>({
表:{
最大高度：“90vh”，
},
表单元格：{
textAlign:'中心'，
边框：“实心”，
边框颜色：“#000”，
边框宽度：1，
填充：0，
}
})
{
此.getOilIndicator（数据）
}

这就是功能：

getOilIndicator(data) {
    return (
    <>
    <Typography variant="subtitle1" align="center" >{"OIL LEVEL"}</Typography>
    <div>            
        <Grid xs
            item>
                {
                    this.getDevice(_.find(this.state.devices, { "id": 5 }), data)
                }
        </Grid>
    </div>
    </>

getOilIndicator（数据）{
返回(
{“油位”}
{
this.getDevice（u.find（this.state.devices，{“id”：5}），数据）
}

---

这里的问题是，即使将填充设置为0，顶部也有不必要的填充。如何删除此填充。我想将文本“Oil Level”放置在表格单元格的最顶部，但由于填充，我无法执行此操作。

垂直对齐：顶部？垂直对齐：顶部似乎有效。谢谢！垂直对齐：顶部？vertical-align:顶部似乎起作用了。谢谢！