How to force Chrome browser to reload .css file wh

Question

I'm currently editing a .css file inside of Visual Studio 2012 (in debug mode). I'm using Chrome as my browser. When I make changes to my application's .css file inside of Visual Studio and save, refreshing the page will not load with the updated change in my .css file. I think the .css file is still cached.

I have tried:

1. CTRL / F5
2. In Visual Studio 2012, Go to project properties, Web tab Choose Start External Program in the Start Action section Paste or browse to the path for Google Chrome (Mine is C:\Users\xxx\AppData\Local\Google\Chrome\Application\chrome.exe) In the Command line arguments box put -incognito
3. Used the Chrome developer tools, click on the "gear" icon, checked "Disable Cache."

Nothing seems to work unless I manually stop debugging, (close out of Chrome), restart the application (in debug).

Is there any way to force Chrome to always reload all css changes and reload the .css file?

Update:
1. In-line style changes in my .aspx file are picked up when I refresh. But changes in a .css file does not. 2. It is an ASP.NET MVC4 app so I click on a hyperlink, which does a GET. Doing that, I don't see a new request for the stylesheet. But clicking F5, the .css file is reloaded and the Status code (on the network tab) is 200.

Answer 1

To force chrome to reaload css and js:

Windows option 1: CTRL + SHIFT + R
Windows option 2: SHIFT + F5

OS X: ⌘ + SHIFT + R

Updated as stated by @PaulSlocum in the comments (and many confirmed)

---

Original answer:

Chrome changed behavior. Ctrl + R will do it.

On OS X: ⌘ + R

If you have problems reloading css/js files, open the inspector (CTRL + SHIFT + C) before doing the reload.

Answer 2

Ctrl + F5

Shift + F5

Both work

Answer 3

Just had this problem where one person running Chrome (on a Mac) suddenly stopped loading the CSS file. CMD + R did NOT work at all. I don't like the suggestions above that force a permanent reload on the production system.

What worked was changing the name of the CSS file in the HTML file (and renaming the CSS file of course). This forced Chrome to go get the latest CSS file.

Answer 4

Easiest way on Safari 11.0 macOS SIERRA 10.12.6: Reload Page From Origin, you can use help to find out where in the menu it is located, or you can use the shortcut option(alt) + command + R.

Answer 5

There are much more complicated solutions, but a very easy, simple one is just to add a random query string to your CSS include.

Such as src="/css/styles.css?v={random number/string}"

If you're using php or another server-side language, you can do this automatically with time(). So it would be styles.css?v=<?=time();?>

This way, the query string will be new every single time. Like I said, there are much more complicated solutions that are more dynamic, but in testing purposes this method is top (IMO).

Answer 6

i had faced same problem here! but I sure,my resolution is better than all above examples,just do this,

1. Pull up the Chrome developer console by pressing F12
2. Right click on the reload button at the top of the browser and select "Empty Cache and Hard Reload."

That`s it!