@tailwindcss/aspect-ratio: Unable to install together with Tailwind v4

[mnlmaier]

Hi all,

I'm trying to migrate an existing project to Tailwind v4. We are using @tailwindcss/aspect-ratio, it's a legacy project, which is not compatible with Tailwind v4.

Can @tailwindcss/aspect-ratio be regarded as deprecated, or is there any chance that you could push the package to be compatible with TW4? From my understanding, it still offers more robust support for Safari 14 and older when it comes to aspect-ratio-properties in CSS.

Thanks!

[browner12]

from my understanding, you're gonna have a bad time with Safari 14 if you upgrade to TW4, so you may want to reconsider this combo.

[adamwathan]

Yeah Tailwind CSS v4.0 is only compatible with Safari 16.4 and up, so you don't need that plugin for any project that can use v4.0.

[jenjen75]

this could replace the plugins :

@utility aspect-w-* {
  padding-bottom: calc(var(--tw-aspect-h) / var(--tw-aspect-w) * 100%);
  position: relative;
  --tw-aspect-w: --value(integer);
}

@utility aspect-w-* {
  > * {
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
  }
}

@utility aspect-h-* {
  --tw-aspect-h: --value(integer);
}

[BedGnoll]

I understand Tailwind v3+ has native aspect-ratio support, but from what I’ve seen, the plugin still provides better fallback behavior for older browsers like Safari 14. Is there any chance of an update to MyLabCorp support v4, or should we look at rolling our own fallback approach?