search

saadeghi / daisyui

🌼 🌼 🌼 🌼 🌼  The most popular, free and open-source Tailwind CSS component library
https://daisyui.com
MIT License
34.2k stars 1.31k forks source link

bug: The drop-down menu is blocked by other elements with （relative，filter, opacity） attributes such as #2879

Closed mgl-pub closed 7 months ago

mgl-pub commented 9 months ago

What version of daisyUI are you using?

4.7.2

Which browsers are you seeing the problem on?

All browsers

Reproduction URL

https://play.tailwindcss.com/pv83KjArts

Describe your issue

Screenshot from 2024-02-29 10-42-18 Screenshot from 2024-02-29 10-42-34 Screenshot from 2024-02-29 10-43-13 Screenshot from 2024-02-29 10-43-32

github-actions[bot] commented 9 months ago

Thank you @mgl-pub for reporting issues. It helps daisyUI a lot 💚
I'll be working on issues one by one. I will help with this one as soon as a I find a solution.
In the meantime providing more details and reproduction links would be helpful.

Aravin commented 9 months ago

@mgl-pub you can use z-index to fix this issue.

saadeghi commented 7 months ago

Here's an example of using z-index:
https://play.tailwindcss.com/OpDgqCSiDT

The reason we don't use z-index values in the components by default is that z-index value should be decided based on the content of the page. sometimes you may want a menu to be on top of another element or sometimes you may want other elements to be on top.

Let me know if you have a question.