2 Answers, 1 is accepted
Hello,
Thank you for the screenshot.
In general, the DatePicker Calendar will be shown top/bottom based on the available space.
In this case, there is no space at the bottom and at the top. If we have a 400px component do show in a 300px container, there always be some part cut off.
Regards,
Stefan
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.
Rank 1
Iron
Thank you @Stefan,
I have a solution for this problem. We can custom popup of DatePicker and set appendTo body of parent Dialog,
we will have a scrollbar in this dialog when on the small screen.
Link demo: https://stackblitz.com/edit/react-na4vms?file=app/main.jsx
Thank you for sharing this approach with the KendoReact community. It is highly appreaciated.
Hello,
As mentioned, this is purely based on the available space it is not something we have control over to show a larger element in a smaller container.
The other option is to use only the DateInput control without the Calendar part for cases when there is no space for the full Calendar:
https://www.telerik.com/kendo-react-ui/components/dateinputs/dateinput/