CSS class changed but the style is taking time to get applied

Question

I added a new class in the custom CSS file in a Django app and changed the HTML accordingly.

The problem is that the class is getting applied to let's say a button but the page is not showing the changes.

For example:

Please check the below snippet

<button type="button" class="btn btn-primary btn-lg">Text</button>

I added a new class .btn-custom in custom.css and changed the HTML file as well.

Now after the refresh, the above tag changed to

<button type="button" class="btn btn-custom btn-lg">Text</button>

But the style is not applied to the page.

I check the custom CSS file by opening the source and the changes I made are there.

After 2 to 3 hrs the changes getting reflected. I tried hard refresh as well cache clearing and every other option related to cache

Did you check if the class styles are being overridden by another class? — Rasso, Dec 15 '19 at 09:12
Yes. Its not. Actually this class will get applied within 2-3 hrs. — muneer, Dec 15 '19 at 09:17
This seems odd, if you can find `.btn-custom` in your stylesheet then its not a cache problem. — Rasso, Dec 15 '19 at 09:21
Yes. It's weird. Maybe something related to Django? I am new to Django. — muneer, Dec 15 '19 at 09:25
I doubt it. Can you provide some code so I can take a closer look? — Rasso, Dec 15 '19 at 09:26

score 1 · Accepted Answer · answered Dec 15 '19 at 09:27

1

The behavior consists of your HTML being successfully changed but your CSS not changed. This indicates the presence of a cache. It can be either the browser cache or server-cache.

I see that you have ruled out caching issues, but from your description it seems that you have ruled out browser cache issues. However, Django has a cache mechanism on its own, which caches static files. And the cache of static files can be turned off.

answered Dec 15 '19 at 09:27

Lajos Arpad

64,414
37
100
175

I tried clearing the Django cache. Still, it's the same.It has to be a cache issue. But I am not able to solve it. – muneer Dec 15 '19 at 09:46
@muneer it's also possible that you have some other server cache, like Cloudflare. – Lajos Arpad Dec 15 '19 at 09:56
The app is in my local development environment – muneer Dec 15 '19 at 10:50
@muneer I advise you to conduct the following test: do a CSS change and take a look at the CSS file in your browser console sources tab. Is it refreshed at all? – Lajos Arpad Dec 15 '19 at 11:22
Django cache clearing solved the issue. Earlier I didn't do it properly. Thanks for helping. – muneer Dec 15 '19 at 13:33

CSS class changed but the style is taking time to get applied

1 Answers1