Home > OS >  My web page sometimes ignores my css file
My web page sometimes ignores my css file

Time:11-07

So I'm building a web application using HTMl CSS and PHP, and sometimes when I make changes to the css file, the web doesn't react to it and I can even delete the whole file and still doesn't change a thing in the browser and I have to copy everything from the css file into a different css file and use that one and after that it works but it often takes only a few minutes and i have to change it back so currently i have style.css and styles.css and depending on the situation i use either the first one or the other one but its annoying, I think it could be something with the server I'm running it on localhost using XAMPP. Thanks for any suggestions.

CodePudding user response:

It is because of the browser's cache.

If you are using Windows or Linux, just go on the browser and hit ctrl f5 to clear the cache. You can also click on google chrome's settings, then search for Cookies and site data and tap Clear data.

Or open Chrome's developer tools by pressing F12 then open the Settings (F1). Find the checkbox labeled Disable cache (while DevTools is open) under the Network heading and turn it on so Chrome will no longer cache your CSS files and always load the latest version when the dev tools window is opened.

CodePudding user response:

Your problem come from browser cache.

  • It's not only happened to CSS file, but to script as well.

There are many solutions for this:

If it's occur to production environment:

  • You can versioning your script and stylesheet file

If it's just about developing in local environment:

  • You can empty cache and hard reload the webpage (by opening devtool, right click in reload icon, select empty cache and hard reload or just simply use ctrl f5). This will need to be done every time you have a change in script or stylesheet file

Empty cache and hard reload

  • Or you can disable browser cache (open devtool by pressing f12, switch to network tab in browser devtool, and check Disable cache.
  • I'm not recommend Disable cache. You should stick with empty cache and hard reload

Disable cache

  • Related