Stylesheet not updating

Question

I am creating a website, but when I made changes to the stylesheet on my site, and I refreshed the site, none of the changes were there.

I tried to use the view sour

Answer 1

Most probably the file is just being cached by the server. You could either disable cache (but remember to enable it when the site goes live), or modify href of your link tag, so the server will not load it from cache.

If your page is created dynamically by some language like php, you could add some variable at the end of the href value, like:

    <link rel="stylesheet" type="text/css" href="css/yourStyles.css?<?php echo time(); ?>" />

That will add the current timestamp on the end of a file path, so it will always be unique and never loaded from cache.

If your page is static, you have to manage those variables yourself, so use something like:

    <link rel="stylesheet" type="text/css" href="css/yourStyles.css?version=1" />

after doing some changes in the file content, change version=1 to version=2 and so on.

If you wish to disable the cache from caching css files, refer to your server type documentation (it's done differently on apache, IIS, nginx etc.) or ask/search for a question on https://serverfault.com/

Assuming IIS - adding the key under with the right settings in the root or the relevant folder does the trick.

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <caching enabled="false" enableKernelCache="false" /> <!-- This one -->
    </system.webServer>
</configuration>

That said sometimes one still has to recycle the Application Pool to "bump" the CSS. Therefore: Disabling IIS caching alone is not a 100% guaranteed solution.

For the browser: There are some notes on fine-grain controlling the local cache on FF over on SuperUser for the interested.

Answer 2

I had the same problem and it was due to the browser caching the stylesheet. Try refreshing the Cache:

    Cmd + Shift + r (on a mac) OR Ctrl + F5 (on windows)

This will do a hard refresh, and should use the new stylesheet that you uploaded to the server.

Answer 3

In my case, since I could not append a cache busting timestamp to the css url it turned out that I had to manually refresh the application pool in IIS 7.5.7600.

Every other avenue was pursued, right down to disabling the caching entirely for the site and also for the local browser (like ENTIRELY disabled for both), still didn't do the trick. Also "restarting" the website did nothing.

Same position as me? [Site Name] > "Application Pool" > "Recycle" is your last resort...

Answer 4

This may be a result of your server config, some hosting providers enable "Varnish" on your domain. This caching HTTP reverse proxy, is used to speed up delivery. One could try to disable varnish on the cpanel (assuming that you have one) and check if it was that.

Answer 5

If your site is not live yet, and you just want to update the stylesheet at your pleased intervals, then use this:

Ctrl + F5

This will force your browser to reload and refresh all the resources related to the website's page.

So everytime you change something in your stylesheet and you wanna view the new results, use this.

On Mac OS Chrome use: Command + Shift + R.

Answer 6

Easiest way to see if the file is being cached is to append a query string to the <link /> element so that the browser will re-load it.

To do this you can change your stylesheet reference to something like

<link rel="stylesheet" type="text/css" href="/css/stylesheet.css?v=1" />

Note the v=1 part. You can update this each time you make a new version to see if it is indeed being cached.