Seguindo a documentação do MUI: https://mui.com/material-ui/react-stack/ Achei que tudo que precisava para centralizar algo tanto vertical quanto horizontalmente era include justifyContent='center' alignItems='center
, mas isso apenas centraliza horizontalmente e não verticalmente. Estou apenas tentando alinhá-lo horizontalmente e verticalmente no componente de papel.
Qualquer ajuda seria apreciada:
<Paper
elevation={2}
sx={{
minWidth: '30%%',
height: '100%',
}}
>
<Box
display='flex'
justifyContent='center'
alignItems='center'
>
<Typography>0</Typography>
</Box>
</Paper>
Você precisa definir dimensões no componente Box para que os atributos flexíveis tenham efeito. Veja: https://codesandbox.io/s/upbeat-glade-m9k6l5