When Coding Html, Browser Doesn't Always Detect Changes

When I'm coding HTML and CSS and load the page in the browser to check changes, sometimes it doesn't update for a while. This obviously causes problems with incremental changes whe

Solution 1:

Try Ctrl+F5 on Windows or Cmd+Shift+R on OSX, this will avoid your browser reading its cache when loading the page (at least when it's Chrome or Firefox)

Solution 2:

You could try deleting your browser cache and reloading the page. In case of CSS I also found sometimes I will need to load the CSS file separately in my browser and refresh it to update.

Solution 3:

Sounds like your browser cache, you can test this by clearing it or doing a "hard refresh" to confirm.

You will need to throw some no cache headers if you want to stop this permanently, you can do this from the web server or server-side code depending on your setup (see How to control web page caching, across all browsers?)

Solution 4:

On windows refresh with CTRL + F5. The browser will not show from cache. Also in developer tools you can tell it not load from cache

Solution 5:

It is mostly because of browser cache.

Just a suggestion(You may find it useful, As an addition to other answers):

If you are on chrome then there is an option to disable cache while the dev toolbar is open. It works for me to ensure there is no caching while I am developing. (I keep my dev toolbar open all the time while developing so it works for me), Here is the screen shot.

Quote from chrome dev tools (https://developers.google.com/chrome-developer-tools/docs/settings)

General

Disable cache Will prevent the caching of resources ONLY for pages which have DevTools open. This will not disable caching if the DevTools are closed

.