2

The directory looks like

C:\wamp64\www\jml_test

    +application
    +css
        -bootstrap.css
        -main.css
        -project_page.css
        -neat.css
    +js
    +photos
    +etc

My head.php directs the index to css via <link href='css/main.css' rel='stylesheet'>. This produces the page with the CSS at initial upload.

I want to make changes to the styling. Naturally, I go to jml_test/css/main.css to edit. The edits, after saved, do not take effect. I have found that changing the file name, changing the directory, and even deleting the main.css file do nothing at all - the initial styling remains. Restarting the server does nothing either.

However, I have found that if I make a new file and point the head there instead (for example, save the desired edits as nerd.css and put <link href='css/nerd.css' rel='stylesheet'> in the head, the updated file is read.

Using realpath(NULL); in the head returns C:\wamp64\www\jml_test, which is the directory described above. From the <link> tag then the target should be at C:/wamp64/www/jml_test/css/main.css.

My question is, what is the head actually reading when it looks at main.css? Something must be amiss for me to be able to delete target file and have it still be read.

Naltroc
  • 924
  • 13
  • 30
  • 3
    It is possible that your browser is using the cached copy of the CSS file even if you refresh the page. As a test, try clearing the cache and then reload the page. – Marc Audet Jan 21 '17 at 21:39
  • Looks like that was the case. Thought I had done it earlier, but just retried again and success. – Naltroc Jan 21 '17 at 22:13
  • 1
    @MarcAudet Post it as an answer and I'll mark it as the accepted answer. Thank you. – Naltroc Jan 21 '17 at 22:14

2 Answers2

1

It is possible that your browser is using the cached copy of the CSS file even if you refresh the page.

Try clearing the cache and then reload the page.

Marc Audet
  • 42,628
  • 10
  • 57
  • 78
0

This is a caching problem

if you update your page frequently, using the original file-name (css, html, js, jpeg, gif, png, etc.), you just do not want to bother a visitor (or yourself) to press F5 or Ctrl+F5 to overcome a cache issue from your side.

note: Ajax content changes do not count as file update, since the original file structure maintains equal.

So there are some solutions, depending on your needs:

1. No caching at all

to avoid caching on a production environment (if your server is accessible publicly) set the header's cache-control: (see this thread)

set headers like:

Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0

2. I need caching for better performance of my site

if you want to make sure any updated file is shown (after a certain time) to your visitor, you can manage using the .htaccess mod_expires.c setting

# BEGIN EXPIRES
<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresDefault "access plus 10 days"
    ExpiresByType text/css "access plus 1 week"
    ExpiresByType text/plain "access plus 1 month"
    ExpiresByType image/gif "access plus 1 month"
    ExpiresByType image/png "access plus 1 month"
    ExpiresByType image/jpeg "access plus 1 month"
    ExpiresByType application/x-javascript "access plus 1 month"
    ExpiresByType application/javascript "access plus 1 week"
    ExpiresByType application/x-icon "access plus 1 year"
</IfModule>
# END EXPIRES

3. I'm on a localhost development envirement

to avoid caching on a development server (your localhost server, where files are constantly updated) you can overrule all caching by setting your browser's features to no-cache.

e.g. Firefox: This is enabled anytime you're opening the browser's toolbox/web console (F12), once you have selected "Advanced Settings" - Disable Http Cache (when toolbox is open)"

Community
  • 1
  • 1
Vickel
  • 6,356
  • 6
  • 30
  • 49