1

My site got some new colors and I updated the color code in my CSS file, but as usual it won't load in IE or Edge for some reason.

I have cleared my cache in my site and browser. It's still not loading in the new color code.

Do you have an idea of how to fix this?

You are asking for details. så here is how my old css looked like.

div#root-wrapper > div.wrapper > div.page > div#top.header-container > div.header-container2 > div.header-container3 > div.nav-container > div.nav.container.clearer.show-bg.has-outline > div.navigation > ul#navi.nav > li:hover {
    background-color:#222;
}

div#root-wrapper > div.wrapper > div.page > div#top.header-container > div.header-container2 > div.header-container3 > div.nav-container > div.nav.container.clearer.show-bg.has-outline > div.navigation > ul#navi.nav > li:hover a span{
    color:#fff;
}

div#root-wrapper > div.wrapper > div.page > div#top.header-container > div.header-container2 > div.header-container3 > div.nav-container > div.nav.container.clearer.show-bg.has-outline > div.navigation > ul#navi.nav > li.level0.nav-2.level-top.parent.active, div#root-wrapper > div.wrapper > div.page > div#top.header-container > div.header-container2 > div.header-container3 > div.nav-container > div.nav.container.clearer.show-bg.has-outline > div.navigation > ul#navi.nav > li.level1.active {
    background-color:#222;
}

New code

div#root-wrapper > div.wrapper > div.page > div#top.header-container > div.header-container2 > div.header-container3 > div.nav-container > div.nav.container.clearer.show-bg.has-outline > div.navigation > ul#navi.nav > li:hover {
    background-color:#671125;
}

div#root-wrapper > div.wrapper > div.page > div#top.header-container > div.header-container2 > div.header-container3 > div.nav-container > div.nav.container.clearer.show-bg.has-outline > div.navigation > ul#navi.nav > li:hover a span{
    color:#fff;
}

div#root-wrapper > div.wrapper > div.page > div#top.header-container > div.header-container2 > div.header-container3 > div.nav-container > div.nav.container.clearer.show-bg.has-outline > div.navigation > ul#navi.nav > li.level0.nav-2.level-top.parent.active, div#root-wrapper > div.wrapper > div.page > div#top.header-container > div.header-container2 > div.header-container3 > div.nav-container > div.nav.container.clearer.show-bg.has-outline > div.navigation > ul#navi.nav > li.level1.active {
    background-color:#671125;
}

IE won't load this. It reads the old one, so some kind of cache issue, but I have tried clearing it all.

http://www.puk-int.dk/bestsellere/den-effektive-marketingplan.html

I can see in the response header that it takes old CSS. But why?

BSMP
  • 4,596
  • 8
  • 33
  • 44
Patrick Knudsen
  • 281
  • 1
  • 3
  • 12
  • Without code and other details (like IE version) we would simply be guessing here. – Mark Schultheiss Feb 24 '16 at 14:47
  • Possible duplicate of [How can I ensure that the latest version of my javascript code is loaded for the client?](http://stackoverflow.com/questions/8491846/how-can-i-ensure-that-the-latest-version-of-my-javascript-code-is-loaded-for-the) – BSMP Feb 24 '16 at 14:50
  • @MarkSchultheiss - There you go, more details. its all IE versions. – Patrick Knudsen Feb 24 '16 at 14:56
  • @BSMP - I have cleared my cache, and it still dont work? – Patrick Knudsen Feb 24 '16 at 14:58
  • Have you tried either of the solutions in the dupe? – BSMP Feb 24 '16 at 15:25
  • Since the cache may not always clear the sub elements (cache is URL based for the most part) try appending a parameter to the CSS file url such as here: http://stackoverflow.com/questions/1239907/can-i-force-a-refresh-of-my-stylesheet-file – Mark Schultheiss Feb 24 '16 at 15:40
  • What's the backend like? I once worked with a .NET developer who mentioned sunbathing about browser-specific server caching when an issue like this came up. He was able to make some changes to the backend so I users saw site changes closer to real time. – denmch Feb 24 '16 at 18:12
  • It's a magento shop. When i got in this morning it fixed itself. Can IE be slower to read new CSS? – Patrick Knudsen Feb 25 '16 at 07:08
  • No, but caching can make your computer take a while to see updated code. – TylerH Feb 29 '16 at 15:58
  • yeah but it should not be dayes i think :/ – Patrick Knudsen Mar 01 '16 at 07:33

1 Answers1

1

There are Developer tools inside of Internet Explorer and Edge that can help you diagnose CSS caching (which seems to be the issue you have encountered).

If you press F12 you will bring up the F12 developer tools, you can go to the network tab. You can then see where the individual CSS files have come from and where they have been served from.

There is an icon on the tool bar that has a server with refresh icon in the corner. You can enable this item "Always Refresh from Server" to ensure that all assets are loaded from the server rather than any cache.

Sometime CSS files are cached by an intermediary Content Delivery Network.... In these instances you may want to look into implementing a cache busting strategy such as those described in this article : https://css-tricks.com/strategies-for-cache-busting-css/

Martin Beeby
  • 4,523
  • 1
  • 26
  • 20