[v4] Hover not working as expected on latest chromium version

[Notplayingallday383]

What version of Tailwind CSS are you using?

For example: v4.0.9

What build tool (or framework if it abstracts the build tool) are you using?: Postcss 8.5.3, React 19.0.0, Vite 6.2.0, Tailwind Postcss 4.0.9

What version of Node.js are you using?: v22.2.0

What browser are you using?: Microsoft Edge
Version 133.0.3065.82 (Official build) (64-bit)

What operating system are you using?

For example: Windows 11 23H2

Reproduction URL

My project where I discovered this is currently privated however I was able to reproduce this on other sites too. To see this in action as an example on the latest chromium version, visit https://play.tailwindcss.com/ and observe hovering over the Read the Docs link and there it is right in action

Describe your issue

So today I got home and continued to work on my project because we plan on entering public beta very soon and I noticed the hover:bg is not working correctly. it was working correctly yesterday and my browser updated today so I think maybe something in the latest chromium update it broke it? I highly doubt it

Below is a screenshot of what this looks like on the tailwind play website

And below this is a Screenshot of what it looks like on a older version of chromium (using browserling)

[philipp-spiess]

@Notplayingallday383 Hey! This was a regression in Chromium 133+ and was fixed in Chromium 133.0.6943.99. Your version (133.0.3065.82) seems to be slightly lower so I suggest you update to get it resolved. 👍

See #16416 for more infos