Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Day Picker calendar overlay pops up behind other components

How do I make the calendar overlay popup for the react day picker input field show on top of the other form components? The calendar is being hidden by the other form components. Is there some sort of z-index that I can set somewhere?

<DayPicker.Input
    name={this.id}
    placeholder="MM/DD/YYYY"
    format="M/D/YYYY"
    value={this.value}
    onDayChange={this.handleDayChange.bind(this)}
    dayPickerProps={datePickerProps}
/>
like image 772
Lambert Avatar asked Jun 27 '17 21:06

Lambert


1 Answers

The overlay has a DayPickerInput-Overlay class which is absolutely positioned: you can add a z-index to that to make the overlay on the top of other elements.

like image 117
gpbl Avatar answered Nov 08 '22 08:11

gpbl