Deeks
Deeks

Reputation: 53

React-Day-Picker popup position

In the React-Day-Picker project, is there a way to change the position of the DayPicker popup? I have a DayPickerInput on the far right of my view, and the DayPicker then opens left aligned with the Input, but this makes the DayPicker get cropped by the edge of my window.

Is there a way to make the DayPicker be right aligned with the Input and have it overflow to the left, so that it won't get cut off by the edge of my window?

Right now it looks like this
(the dots are the input)
     ....._____
     |         |
     |         |
     |         |
     |_________|
and I want it to look like this
 _____.....
|         |
|         |
|         |
|_________|

Upvotes: 4

Views: 2582

Answers (1)

pesho hristov
pesho hristov

Reputation: 2060

After some struggle I managed to reproduce partially the markup of the datepicker, with some dummy content inside:

enter image description here

This way we can see the styles that are being applied to the datepicker. So, with some overrides in the CSS we can achieve the desired result:

enter image description here

Hope this helps :)

Upvotes: 1

Related Questions