codeigniter website on a host- CSS changes does not change front end elements

  • My site is in a Host. (Not localhost)
  • Framework: CodeIgniter.
  • Changes made using CSS: Flot chart's legend

I did changes to front end using Chrome tools/developer tools. I can see all the changes I made instantly.

I FTP to the site, downloaded the CSS file, did necessary changes (same as chrome developer changers) and uploaded the CCS file.

I access the site, but I cannot see the changes I made using CSS file.

Answers


  1. Check if your hosted CSS contains the latest changes
  2. If CSS is ok try to open chrome dev tools and inspect the element that you are trying to modify. Scroll through the CSS applied to that element and check if your styles are there.
  3. If you didn't find any of the styles that you are tring to apply to the element probably you misspelled the selector name. Remember to check .class #id

also, in order to ensure that your CSS files are not cached suffix your php files like this

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

EDIT tip above also works for any resource! (css, javascript files, images ...)


Try Ctrl+F5. It's hard refresh


change the name of the css file so there are no cache issues and then check. if that does not work then look at your source code and copy paste the address of the css file to make absolutely certain you have the link correct.


I think your CSS is still cached so have a Look at this popular question: How to force browser to reload cached CSS/JS files?

There are some solutions how you can force your browser to refresh the CSS or js.

The easiest answer you will get is using something like this:

  /styles/screen.css?v=1234

If you did a change all you have to do is to +1 the counter!

In PHP you van also use this:

  <link rel="stylesheet" href="mycss.css?v=<?php echo filemtime('mycss.css') ?>"/>

It's like an autocounter using the timestamp of the CSS file.


In the DevTools Settings (F1) or in the Network panel (depends on what version of Chrome you are using) tick the Disable cache (while DevTools is open) checkbox. If caching is your problem, it should get fixed.


Need Your Help

Relative Image URL in Javascript File - ASP.net MVC and IIS 7

javascript asp.net-mvc iis-7

I am developing an Asp.net mvc application, everything works fine in ASP.net development server but when I am trying to host it on IIS 7. I am getting problem related to URL resolution. I have used