I am having a lot of issues with CSS editing on my site! Some colors don't change and I have tried the following to no avail: -flush all caches -performance - development: disabled all caching and "Aggregate and compress CSS files" -Devel module "Rebuild the theme registry on every page load"

I also removed the .css file and my page will still load with old colors in the body background and 2 other divs! Any help would be greatly appreciated as this is keeping me from opening up my site!

  • 1
    is your browser caching things still? does it exhibit this behavior if you use another one? on a different client? etc. – Jimajamma Dec 29 '13 at 23:08
  • what theme you are using? if you are using the latest version of zen theme, you need compass to compile your css. – cayerdis Dec 29 '13 at 23:46
  • I tried in Chrome which is my 2nd browser to make sure, that's what makes it weirder! I am using Premium Responsive theme – GroovyMotion Dec 30 '13 at 4:48

Since it sounds like you've got all the Drupal-related items checked, perhaps it's worth a shot in the dark...

Pull up the site in Chrome and inspect the element that's supposed to have the updated colors (right click and select "Inspect element"). This may reveal one of two things:

  1. Click the "Computed" tab in the right-hand column. Is your color change being overwritten by a more specific declaration? (eg: #foo .some-class { ... } will supersede .foo-class .some-class { ... } regardless of the order in which they appear)
  2. Perhaps you've been editing the wrong file? I know I've done it before... Click the Sources tab and make sure the page is loading the file you expect it to load. Make some random changes, reload and check that those changes show up.

Hope that helps.

| improve this answer | |
  • I checked in chrome and in that specific divider here is what it shows: media="all" #copyright { background-color: #ccc;background-image: -webkit-linear-gradient(top, #c3c9ee, #9999cc);padding: 25px 0px;text-align: center;} but it's all crossed as if it was written off – GroovyMotion Dec 30 '13 at 14:47
  • If it's all crossed off, then it means that those directives were superseded by a more specific directive (option #1, above). In the "Computed" tab, take a look at which CSS directive is used and make sure your directives are more specific. – mikeker Jan 3 '14 at 3:59
  • Grrr. Crappy editing UI. Here's what I meant to say: – mikeker Jan 3 '14 at 4:07
  • (Christ, and now I'm running into the 15-second timer issue!) If it's all crossed off, then it means that those declarations were superseded by a more specific declarations option #1, above). In the "Computed" tab, take a look at which CSS declaration is used and make sure your's is more specific. See w3.org/TR/CSS2/cascade.html#specificity. The short version: the more of the DOM your declaration specifies, the more specific while ID's trump classes along the way. – mikeker Jan 3 '14 at 4:08
  • 1
    I found the culprit!! The page calls a colors.css file that supercedes my style.css! Thanks for the tip mikeker – GroovyMotion Jan 3 '14 at 15:42

Sounds like cache is still enable, disable it in admin/config/development/performance make sure the following are disabled:

  • Cache pages for anonymous users
  • Cache blocks

Also make sure bandwidth options are disabled:

  • Aggregate and compress CSS files.
  • Aggregate JavaScript file

Make sure when you are developing those options are disabled and in your production site they are enabled.

Another things that might cause:

  • browsers plugins might be interfering.
  • if you are using a framework like compass make sure you are compiling the last changes.
| improve this answer | |
  • nope...Cache pages for anonymous users and Cache blocks were disabled and Aggregate and compress CSS files as well as Aggregate JavaScript files. Not using a framework either :( – GroovyMotion Dec 30 '13 at 4:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.