CSS file not refreshing in browser

Question

When I make any changes to my CSS file, the changes are not reflected in the browser. How can I fix this?

Answer 1

Since I found this thread having the same problem, 10 YEARS later, I'll add my own solution too. I use PHP most of the time, and rather than requiring the user to press unusual buttons to refresh the page, or myself to remember to bump a version number embedded in a link, I used the filemtime() function to get the modification time of the css file (as a unix timestamp), and then use THAT number as the parameter.

$FILE_TIME = filemtime("main.css");
$CSS_LINK  = "main.css?version=$FILE_TIME";

While results in a URL like:

http://example.com/blah/main.css?version=1602937140

This entirely disables caching, since every time the page is refreshed, it will believe it needs to grab the CSS file again, changed or not... but that's far less frustrating than forgetting to manually update this trick and wasting time wondering why it isn't right. You can always remove it from a production server.

If you are using plain HTML, you could probably engineer a javascript wrapper or some such, but that's probably more trouble than it's worth.