[v4] The ring utility class is not working on Android 14 Chrome 113.

[mwc]

What version of Tailwind CSS are you using?

v4.0.0-beta.9

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

Nuxt v3.15.2, Tauri v2, vue latest

What version of Node.js are you using?

v22.11.0

What browser are you using?

Chrome 113.0.5672.136

What operating system are you using?

Android 14(API 34)

Describe your issue

The ring utility class is not working as expected on Android 14 using Chrome 113.0.5672.136(maybe not an outdated version yet???).

It works fine on iOS devices.

code:

<div class="m-2">
  <div class="p-4 w-40 h-40 bg-gray-100 ring ring-yellow-400">content</div>
</div>

result:
left-ios, right-android

[MartinCura]

ring was replaced with ring-3: https://tailwindcss.com/docs/v4-beta#default-ring-width-change

[mwc]

@MartinCura

I think the issue with Tailwind CSS is more likely due to browser compatibility rather than the change from ring to ring-3. It works fine in the latest version but fails to render properly in Chrome 113.0.5672.136.