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

Question

这是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>

这是函数：

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>
    </>

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