Sliders in Firefox are rendered incorrectly

[ivxvm]

Here's screenshot: https://imgur.com/a/0RGIZ77 https://i.imgur.com/3GL9LP2.png

macOS 13.3.1 (a) Firefox 115.0.2 (64-bit)

[ahfontaine]

Same here Win 10 115.0.3 (64-bit)

[renny-ren]

I just looked into the code, it seems that thez-index property doesn't apply to pseudo-elements like ::-moz-range-thumb in Firefox, which caused this issue. ([&::-moz-range-thumb]:z-20 is not working on Firefox) To fix this we have to create a custom slider thumb.

[sajadevo]

@renny-ren I'm working on v3 and there is a plan for a custom slider entirely.

[rohit-arium]

Hi @sajadevo, when can we expect the release of v3 for revamped slider component?

[MarceloViannaDev]

Same here, @latest from material-tailwind + @latest NextJs + React ... all updated. What I found to fix was, to create a secondary slider just for Firefox. Sad but... the only way I found ... 😔