Menu
I made some changes on a CSS file on a PHP site.
The changes do not show up in any browser I test it on until I hold down the CTRL key and click the browser's REFRESH button.
This means that most users are not going to seem the changes I made.
How can I force browsers to show the changes to CSS files immediately (without renaming the CSS file)?
803
Here’s one way to do it: Notice that I’m pointing to my CSS using the commonly known <link> element. But I’ve also added what’s called a query string to the end of the file name. The browser will view a file name of style.css as different from a file name of style.css?v=1.1, so it will generally force the browser to update the CSS.
Browsers cache. Anytime you make changes to CSS, JavaScript and are viewing the page you've updated - you will see this concern. You can force a refresh by pressing CTRL+F5 on the browser and that will get the latest version.
Anytime you make changes to CSS, JavaScript and are viewing the page you've updated - you will see this concern. You can force a refresh by pressing CTRL+F5 on the browser and that will get the latest version.
The browser will view a file name of style.css as different from a file name of style.css?v=1.1, so it will generally force the browser to update the CSS. So, each time you update your CSS on the server, you can incrementally update your version number.
Add a unique string as query string when linking the stylesheet. Here's an example
<link href="style.css?<?=filemtime("style.css")?>" rel="stylesheet" type="text/css" />
It depends on your web server. Apache can be set to configure the maximum cache time for a given file, and I'm pretty sure IIS can do the same.
Alternatively, a common solution to FORCE uncaching is to version your CSS file names (Rails does this internally). For example, style.css becomes style-10162009.css
23
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
