DateRangePicker cannot render correctly inside a scrolling container
See original GitHub issueBecause DateRangePicker__picker
is rendered adjacent to DateRangePickerInput
, it cannot work correctly inside containers that scroll their overflow - it will either push the edges of the container outwards, or be clipped if you have something like overflow-y: scroll; overflow-x: hidden;
. I believe I opened a ticket similar to this about five months ago, and it was “fixed” in #83.
@majapw Any update on this? I can provide an example if needed but it’s quite simple to reproduce.
Issue Analytics
- State:
- Created 7 years ago
- Reactions:1
- Comments:19 (9 by maintainers)
Top Results From Across the Web
DateRangePicker cannot render correctly inside a scrolling ...
This is because the DateRangePicker__picker is set adjacent to the root, so it scrolls like "normal" content, despite it not being intended to....
Read more >jQuery UI datepicker positioning issue in scrollable div
Specifically, "other-selector" should be position: relative; making the absolutely positioned #ui-datepicker-div relative to its new parent.
Read more >#7081 (datepicker positioning/rendering detection does not ...
im trying to put a date picket inside a fixed div at the bottom of the page (facebook style mini nav). ex: <div...
Read more >DatePicker not changing position when scrolling - Telerik
I think this is because the animation-container is rendered outside of the scrollable area and the container is positioned absolute.
Read more >iOS14 SwiftUI DatePicker - How to … | Apple Developer Forums
When I run this, the date picker is displayed modally. How do I get it to expand inline in the form? I can't...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I’m trying to think of whether the right approach is to have a
withTether
prop, or to have aTetheredDateRangePicker
or to assume copying of the DRP contents. I feel like you likely wouldn’t have to copy everything because you wouldn’t necessarily need all the options, but I can understand the consternation.@ljharb do you have any thoughts on this?
Nice, guys! Thank you so much for your support 😉