Breaking News: Grepper is joining You.com. Read the official announcement!

center in mui

Rad answered on October 18, 2021 Popularity 9/10 Helpfulness 10/10

answer center in mui

related mui center element

center in mui

Comment

// centered component in mui 5

import Box from '@mui/material/Box';

export default function Center(props: any) {

    const { children } = props

    return (
        <Box
            sx={{
                display: 'flex',
                justifyContent: 'center',
                alignItems: 'center',
                flexDirection: 'column'
            }}
            {...props}
        >
            {children}
        </Box>
    );
}

Popularity 9/10 Helpfulness 10/10 Language typescript

Source: Grepper

Tags: center mui typescript

Link to this answer
Share Copy Link

Contributed on Feb 22 2023

Rad

0 Answers Avg Quality 2/10

Closely Related Answers

mui center element

Comment

-2

<Grid
  container
  spacing={0}
  direction="column"
  alignItems="center"
  justifyContent="center"
  style={{ minHeight: '100vh' }}
>

  <Grid item xs={3}>
   <LoginForm />
  </Grid>   
   
</Grid>

Popularity 10/10 Helpfulness 10/10 Language whatever

Source: stackoverflow.com

Tags: center ce

Link to this answer
Share Copy Link