MUI DatePicker - issue with placement popper-dialog

1.8k Views Asked by At

I'm using MUI v6.0.2 and I came across an issue with popper placement. When I scroll up and try to open a date picker it doesn't open on the top of the input, but somewhere upper in the page. Bottom placement works good, as expected. But it looks something wrong with placement top.

Current behaviour

My dependency: "@mui/x-date-pickers": "^6.0.4",

Import: import { DatePicker } from '@mui/x-date-pickers/DatePicker';

Expected behaviour

That's my code. I didn't pass any other properties to the component.

<Box marginTop={'1000px'}>
  <h2>Date picker</h2>
  <DatePicker />
</Box>
1

There are 1 best solutions below

2
On

I have exactly the same issue, I am using DesktopDatePicker (x-date-pickers": "^6.2.1") with TextField inside. On first open action it renders in proper place, anchored to the input. But when I try to change the year, Popper jumps to left-top corner.