tailwindlabs / tailwindcss

A utility-first CSS framework for rapid UI development.
https://tailwindcss.com/
MIT License
83.27k stars 4.22k forks source link

[v4] Modifiers are not working with custom utilities #15065

Closed b-meyer closed 23 hours ago

b-meyer commented 1 day ago

What version of Tailwind CSS are you using?

v4.0.0-alpha.36

What build tool (or framework if it abstracts the build tool) are you using?

@tailwindcss-cli

What version of Node.js are you using?

v20.18.0

What browser are you using?

Chrome

What operating system are you using?

Windows

Reproduction URL

v4 - https://play.tailwindcss.com/5J8xPhUZ6g v3 - https://play.tailwindcss.com/jEOLXrPd2M

Describe your issue

Some if not all modifiers are not working with custom utilities added to the any tailwind @layer. This is working as expected in v3. And it is also working correctly with built-in utility classes. My example above uses font-bold and a custom utility that adds another bold class.

group-open:font-bold -- Works group-open:bold -- Does not Work