[v4] rounded-full / border-radius not rendering correctly on iOS 26 Mobile Safari

[weilinzung]

In Tailwind CSS v4, the following simple element does not render as a circle in Safari on iOS 26 (likely iOS 18 beta). Instead, the border-radius seems to be ignored, and the box appears square:

<div class="w-20 h-20 bg-red-500 outline rounded-full"></div>

If you’re seeing similar behavior, please comment below with your device, iOS version, and Tailwind version. If you’ve found a clean workaround (or if this is fixed in newer Safari builds), let’s track it here.

If hardcoded the border-radius to a fixed value which seems fine: border-radius: 99999px

https://play.tailwindcss.com/MYrW4Ykuou