как сделать sticky позиционирование в grid MUI?
Нужно две колонки и чтобы при пролистывании правая колонка была зафискирована на MUI
<Grid container spacing={2} sx={{ overflow: 'unset' }}>
<Grid size={8}>
<Stack spacing={2}>
основной контент
</Stack>
</Grid>
<Grid size={4}>
<Box
sx={{
p: 3,
borderRadius: 2,
background: 'rgba(255,255,255,0.1)',
position: 'sticky',
top: 20,
}}
>
<Typography variant="h6" sx={{ mb: 2 }}>
Правая колонка (фиксируется)
</Typography>
<Typography>Эта колонка остаётся видимой при прокрутке левого контента.</Typography>
</Box>
</Grid>
</Grid>
Получается что элемент пролистывается вместе со всей страницей