Can I force a refresh of my stylesheet file?

Question

I have just spent half a day quietly going mad.

I'm making changes to my classes in the Site.css file and they were not being reflected in the site being developed on my machine. Because I'm learning my way through jQuery and playing with addClass and removeClass and I'm creating the parameters for those calls dynamically, I was sure the problem was in my implementation.

Turns out the CSS file was cached in the browser and all I had to do was refresh it...

Is there a way to force a refresh (preferably only during debug I guess)?

Answer 1

A popular way of "cache-breaking" is to append a parameter to your css source. Typically a timestamp is used. I prefer the "file last modified" time, ie. filemtime() in PHP. I'm sure there's an asp.net function that would give you that.

Then your CSS tag becomes:

<link rel="stylesheet" type="text/css" media="screen" href="/main.css?123456789"/> 

with the query parameter changing whenever the CSS file is updated.

Answer 2

Press CTRL+F5 to hard-refresh everything on your webpage including scripts and stylesheets.

Additionally, you can incorporate the stylesheets to be served from a dynamic server page [php/asp.net] and the Response.Expires = -1 which will force the client to load the css on every HTTP-GET request explicitly. You can also do this in your webserver settings for CSS mime types.