Google Chrome won't update CSS

Question

I just started working on a Wordpress theme, but it won't reload the stylesheet after I update. I searched throughout here and tried the common remedies, including:

• Reload holding ctrl/shift
• Reload while Developer Tools is open
• Reload twice quickly in a row
• Get firefox/firebug
• Add the timestamp generator to the end of the href
• Install an extension, specifically this one: https://chrome.google.com/webstore/detail/clear-cache/cppjkneekbjaeellbfkmgnhonkkjfpdn?utm_source=chrome-app-launcher-info-dialog\

It seems like it only reloads every once in a while, and it really impedes my ability to write CSS...

Does anyone here have any ideas to fix this?

Thanks.

edit: I think it may have something to do with my host (it's free). I'm just going to move offline for development, I think.

Answer 1

When working with child theme, make sure you are loading the right css file. Sometimes you load the parent's css file.

Make sure to disable cache plugin in development time.

Answer 2

You can always go into Incognito which does not use any chached data. It also does not save any history information.

To use it you can press Crtl+Shift+N then navigate to the page / website that you want to see.

You can also access Incognito by pressing the ☰ icon in the top right of your chrome window and click on New incognito window:

If your page is still not updating I would make sure that the file is even being saved. Because at this point your issue would not be because of files being cached..

My only other thought is that it could be your CSS itself... Sometimes your CSS is not applied due to an error in your code, another piece of code counteracting it, etc...

So see what is being applied:

press F12

OR

right click somewhere on your page and press Inspect Element.

You should see something like this (except with your code / webpage):

The parts of the "Inspect Element" will be sized slightly different but you can change those around...

Essentially click on the html element that you are trying to change the css on...

You will now see what css elements are being displayed... If they are crossed out, it most likely means that there is some other parent (or just some other property) that is canceling out the css you are adding.

These are just some of the reasons why the CSS may not be working! But I hope this helps!