Issue: Report CloudFlare @supports Issue to Cloudflare Devs

Hi,

I am not a CloudFlare customer myself, but I represent a web application that has clients who are CloudFlare customers. Every such client/CloudFlare-customer that we have had has needed to disable CloudFlare caching of our application's CSS files, which requires using 2 rules (I understand only 3 rules are allowed in a free tier).

When CSS contains an @supports block, e.g.
@supports (display: flex) { .myClass { display: flex }}

It works on the first request (cache miss), which means that the application is working properly and the CSS is fully present. However, once CloudFlare caches CSS, we consistently see that the cache hit cuts like so:
@supports (display: flex) { .myClass { display: flex

If anything appeared later in the original CSS file, it is missing in the cache response.

This is an even worse problem if the CSS is embedded inline (which I think mod_cloudflare might do automatically for some files), because CloudFlare cuts the entire HTTP response in the same way for inline CSS.

I am not sure if this problem extends to other CSS @ blocks, like @media, but you should ensure that it does not cause such a devastating condition as it currently does. Web sites affected by this issue either appear unstyled, or do not appear at all, when serving from the Cloudflare cache.

Please resolve this and push it out to your customers ASAP.

Thanks,
Ted Phillips
VaultWiki Team