Open quick007 opened 2 months ago
I have met the same problem with you. And I think it might be designed deliberately by TailwindCSS team.
@gaojunran are you triggering a border on hover/focus but don't want CLS like I am (and why I filed this issue). Instead, you can do border-transparent
and border-inherit
, i.e. border border-transparent hover:border-inherit
if you define border-red-100 and border-opacity-
Yep!
What version of Tailwind CSS are you using?
3.4.7
What build tool (or framework if it abstracts the build tool) are you using?
"next": "14.2.5", "postcss": "^8.4.40",
What version of Node.js are you using?
v22.0.0
What browser are you using?
Chome
What operating system are you using?
Windows
Reproduction URL
https://play.tailwindcss.com/2kFJgAhjXC
Describe your issue
You need to add a border color for
border-opacity-<number>
to work. Justborder border-opacity-<number>
should work on it's own.