How to limit the mui grid to a box

Question

I made a multi-card grid layout with Mui grid

I want to limit the grid box to a particular region on screen, something like:

the user should have to scroll to see the rest

This is the code that doesn't work as I want it to

    return (
        <Box className={classes.pageContainer}>
            <Typography className={classes.backgroundText}>WORKS</Typography>
            <Box sx={{ height: '600px' }}>
                <Grid container spacing={6} className={classes.gridContainer} justifyContent="center">
                    {temporaryVideos.map((cardInfo, ndx) => {
                        return (
                            <Grid item>
                                <VideoCard cardInfo={cardInfo} index={ndx} />
                            </Grid>
                        );
                    })}
                </Grid>
            </Box>
        </Box>
    );

Thanks in advance

Rafael

Answer 1

I did it

I placed an "overflowY: 'auto'" on the grid container