For some reason, I can't seem to make the divider extend to the full length of the page.
<TableRow>
<TableCell className={classes.tableCell} colSpan={6}>
<Box
display="grid"
gridTemplateColumns="12% 12% 12% 12% 12%"
gridRow="1"
>
<Box textAlign="left" gridColumn="1">
<p>One</p>
</Box>
<Box textAlign="left" gridColumn="2">
<p>Two</p>
</Box>
<Box textAlign="left" gridColumn="3">
<p>3</p>
</Box>
<Box textAlign="left" gridColumn="4">
<p>4</p>
</Box>
</Box>
<Divider variant="fullWidth" style={{ width: "110%" }} />
<Box padding={1}>
<TableContainer>
<Table stickyHeader>
<TableHead>
<TableRow>
</TableRow>
</TableHead>
</TableContainer>
</Box>
</TableCell>
</TableRow>
This is how it's currently displaying on the page.