CSS file only working for mobile or desktop but not both

I just started noticing that my site css file will be included in the page when loaded but the actual CSS will not work. What is odd is the css works on mobile but not desktop. Then when I upload the css file and check it with the desktop it then works but the mobile quits implementing the css.

It seems to be whatever platform I view the site from first is the one that works.

Am I missing something? I am loading the css file using AppAsset.

I think this may be a Cloudflare issue. Everything seems to work ok on my actual server but not on my Cloudflare server.

This is usually the browser cache.

Best way to solve it is versioning your resources, by adding the v param to your files in your AppAsset.php:

public $css = [
    'css/site.css?v=1.0',
];

I’ve just added the ?v=1.0, where 1.0 is this current file version.
When you change your css, just update this line of code to 1.1, 1.2, and so on.

It turned out it was the css minifier that Cloudflare was implementing.

1 Like