I'm porting an app using tailwindcss to work with IE11. Unfortunately, tailwindcss insists on generating colors using the modern W3C CSS Color Module Level 4 rgb() syntax, which does not appear to be working in IE, e.g. it generates classes like these:
.bg-blue-500 {
--tw-text-opacity: 1;
color: rgb(59 130 246 / var(--tw-bg-opacity));
}
I have tried using postcss-color-rgb in my postcss pipeline to transform this back into the usual syntax to no avail:
postcss([
require('tailwindcss')(twConfig),
require('postcss-color-rgb'),
require('autoprefixer'),
]).process(cssContent, {
from: css,
to: `build/${name}.css.tmp`
})
Tailwind claims to be compatible with any modern browser, which some might dare to classify IE11 as. Any thoughts on getting tailwind to play nicely with IE11 here?