我想在mui表的右邊添加邊距。然而,它不起作用
這是我的代碼:
<TableContainer>
<Table sx={{ mr: 100 }} aria-label="customized table">
<TableHead>
<TableRow>
<StyledTableCell sx={{fontSize: 20, borderBottom: "1px solid #d9d9d6", borderTop: "1px solid #d9d9d6", borderLeft: "1px solid #d9d9d6", borderRight: "1px solid #d9d9d6"}}>RPC Name Response</StyledTableCell>
</TableRow>
</TableHead>
<TableBody>
<TableRow>
<TableCell sx={{borderBottom: "1px solid #d9d9d6", borderLeft: "1px solid #d9d9d6", borderRight: "1px solid #d9d9d6"}} className="response-container">
<div className="response">{response}</div>
</TableCell>
</TableRow>
</TableBody>
</Table>
</TableContainer>
我用mr把sx加到表中,但是不行。 有人知道如何給mui表加邊距嗎?
這兩個(gè)& ltTableContainer />并且& lttable/>;默認(rèn)情況下,組件的寬度設(shè)置為100%。如果您想要邊距,請(qǐng)將該元素的寬度設(shè)置為auto。
<TableContainer sx={{ mr: '100px', width: 'auto' }}>
<Table aria-label="customized table">
<TableHead>
<TableRow>
<StyledTableCell
sx={{
fontSize: 20,
borderBottom: '1px solid #d9d9d6',
borderTop: '1px solid #d9d9d6',
borderLeft: '1px solid #d9d9d6',
borderRight: '1px solid #d9d9d6',
}}
>
RPC Name Response
</StyledTableCell>
</TableRow>
</TableHead>
<TableBody>
<TableRow>
<TableCell
sx={{
borderBottom: '1px solid #d9d9d6',
borderLeft: '1px solid #d9d9d6',
borderRight: '1px solid #d9d9d6',
}}
className="response-container"
>
<div className="response">{response}</div>
</TableCell>
</TableRow>
</TableBody>
</Table>
</TableContainer>