bug: V5 Dropdown mispositioning using popover API and anchorpositioning
Closed this issue · 2 comments
What version of daisyUI are you using?
5-alpha49
Which browsers are you seeing the problem on?
Firefox
Reproduction URL
https://v5.daisyui.com/components/dropdown/
Describe your issue
It happens on both normal Firefox and Firefox nightly
Thank you @J4gQBqqR
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.
Anchor positioning is the standard solution for dropdowns, but it's very new.
Firefox doesn't support it yet: https://caniuse.com/css-anchor-positioning
So as and incremental adaptation, we show the dropdown in the middle of screen. It works, it doesn't break the functionality, but it shows in the middle of screen like a modal.
There's a polyfill that makes it work until Firefox adds the support:
https://github.com/oddbird/css-anchor-positioning
Alternatively you can still use the other methods such as