search

Vuepic / vue-datepicker

Datepicker component for Vue 3
https://vue3datepicker.com
MIT License
1.43k stars 142 forks source link

DatePicker Calendar Not Displaying Over Tailwind CSS Dialog #811

Closed jtalbourdet closed 5 months ago

jtalbourdet commented 5 months ago

Problem Description

When integrating the vue-date-picker component within a Tailwind CSS dialog, the date picker's calendar does not display correctly. Specifically, clicking on the input field to select a date appears to render the calendar hidden behind the modal dialog, rendering it unusable.

Steps to Reproduce

  1. Create a dialog/modal using Tailwind CSS.
  2. Integrate the vue-date-picker component within this dialog.
  3. Click on the date picker's input field to open the calendar.

Expected Behavior: The calendar from the date picker should appear on top of all page elements, including the Tailwind CSS dialog.

Actual Behavior: The calendar appears to be rendered but is visually hidden behind the dialog, making it inaccessible.

Jasenkoo commented 5 months ago

You can just override z-index if that is causing the issue. It is hard to know what the issue is exactly, you would have to provide and example code.