How to force Chrome browser to reload .css file?

Internet browsers like Chrome cache every front end resource like javascript or CSS style sheets. They primarily do this to increase website performance. But this can be really irritating while one is in development modes and constantly modifying the javascript or css style sheets. The only way to see the changes is by doing a hard refresh or clear the cache of the browser.

A hard refresh is a way of clearing the browser’s cache for a specific page, to force it to load the most recent version of a page. Sometimes, when changes are made to the website, they don’t register immediately due to caching. A hard refresh will usually fix this, though occasionally completely clearing the cache is necessary.

You can force Chrome browser to do a hard refresh by using the following short cut keys

1. Hold down Ctrl and click the Reload button.
2. Or, Hold down Ctrl and press F5.
3. Open the Chrome Dev Tools by pressing F12. Once the chrome dev tools are open, just right click on the refresh button and a menu will drop down. This menu gives you the option of doing a hard refresh, or even clearing the cache and do a hard refresh automatically.

Follow the steps below to clear the Chrome cache, history, and cookies on iPhone and iPad:

1. Open Google Chrome on your iPhone or iPad and tap the Options icon ...

2. Tap Settings

3. Scroll down and tap Privacy.

4. Tap Clear Browsing Data.

5. Select which Browsing Data to clear (Browsing History, Cookies, Site Data, Cached Images and Files) then Tap Clear Browsing Data.

6. Tap Clear Browsing Data again to confirm your selection.