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 develope

Answer 1

One trick is to add a QueryString parameter in the link to your stylesheet

What does '?' do in a Css link?

Answer 2

I'm not sure about all browsers, but in IE8 you can use the developer tools...

Go To:

Tools -> Developer Tools (F12)

Then (while on your page) inside the Developer Tools:

Cache -> Always Refresh From Server

Answer 3

I use this trick:

<link rel="stylesheet" type="text/css" href="cssfile.css?t=<%= DateTime.Now.Ticks %>" media="screen" />

Answer 4

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 5

For ASP.NET, the code behind (you can put this in a utility class or master page):

public static string GetTimestampedUrl(string virtualPath)
{
  var realPath = HostingEnvironment.MapPath(virtualPath);
  var file = new FileInfo(realPath);

  return VirtualPathUtility.ToAbsolute(virtualPath) + "?" + file.LastWriteTime.ToFileTime();
}

And then in your page:

<link href="<%= GetTimestampedUrl("~/screen.css") %>" rel="stylesheet" type="text/css" media="screen" />

Answer 6

The easiest way is to disable caching in your browser. If you can't or don't want to do this, you can press ctrl+f5.

Your server or asp application might be caching, too. You can disable this in the web.config or you can restart the development server to make sure the latest version of your file is shown to the user.