CSS Changes Not Showing on the Website

Page Builders & Themes

You saved the change. The site disagrees.

datacram.com/fix/css-changes-not-showing-on-website
Likely causes, ranked
CSS Changes Not Showing on the Website
Caching at one or more layersmost likely
A more specific rule winningcommon
Editing the wrong filecommon
Minified or combined CSSpossible
Fix steps in this guide5
the causes explained below, most likely first
What you’re seeing

You edit CSS, save, reload — and nothing changes. Sometimes it appears for you and not for anyone else, or shows up hours later on its own.

What it actually means

There are only two possibilities, and telling them apart takes about ten seconds. Either the browser is not receiving your new CSS, or it is receiving it and choosing to apply something else instead.

The first is caching, and there are usually more layers than people expect: the browser, a caching plugin, the host's own cache, and a CDN. Any one of them can serve the old file.

The second is specificity. CSS resolves conflicts by how specific each rule is, so a more specific rule elsewhere quietly wins and your change is loaded but overruled. Opening developer tools tells you which situation you are in immediately.

What usually causes it

Most likely first.

  1. 1

    Caching at one or more layers

    Plugin, host, CDN, or browser serving the previous stylesheet. The most common cause by far.

  2. 2

    A more specific rule winning

    Your rule loads but another with higher specificity takes precedence, so nothing appears to change.

  3. 3

    Editing the wrong file

    Changing the parent theme while a child theme is active, or editing a file the site does not actually load.

  4. 4

    Minified or combined CSS

    The optimized bundle is regenerated on its own schedule, so edits do not appear until it refreshes.

  5. 5

    Inline styles from a builder

    Page builders write styles directly onto elements, and inline styles beat almost anything in a stylesheet.

How to fix it

Work through these in order. Take a backup before you change anything.

  1. Step 1Inspect the element first

    Right-click, Inspect. If your rule appears with a line through it, it is loading and being overridden — a specificity problem, not caching. If it is absent entirely, it is caching.

  2. Step 2Purge every cache layer

    Caching plugin, host cache, CDN, then a hard refresh. Missing one layer is why this often looks half-fixed.

  3. Step 3Test in a private window

    If the change appears there, it was your browser cache and everyone else has been seeing it all along.

  4. Step 4Increase specificity properly

    Add a more specific selector rather than reaching for !important, which wins the argument now and makes the next one much harder.

  5. Step 5Confirm you are editing the live file

    Use Additional CSS in the Customizer or your child theme's stylesheet, and check the page source to see which files are actually loaded.

When to stop and call someone

Call someone if changes appear for some visitors and not others long after purging, which usually means CDN configuration, or if the stylesheet has reached the point where every new rule needs !important to work — that is a sign the CSS needs untangling rather than extending.

Frequently asked

Either the browser is being served a cached copy of the old stylesheet, or your rule is loading but being overridden by a more specific one. Inspecting the element tells you which: a struck-through rule means specificity, an absent rule means caching.

Purge in this order: your caching plugin, your host's built-in cache, your CDN, then hard-refresh the browser. Missing any single layer will keep the old file in circulation, which is why this often appears to work only partially.

Because you cleared your own browser cache and they have not, or because a CDN edge near them still holds the old file. Checking in a private window and purging the CDN confirms and resolves it.

Only as a last resort. It wins the immediate conflict but makes every future override harder, and a stylesheet full of !important eventually becomes impossible to work with. Writing a more specific selector is almost always the better answer.

In Appearance, Customize, Additional CSS for small changes, or in a child theme's stylesheet for anything substantial. Never edit the parent theme's stylesheet directly — the next theme update overwrites it.

Free · AI-powered · Emailed to you

See exactly what’s holding your website back.

Get a free audit of your site — speed, SEO, mobile, and security — with the fixes that matter most, delivered as a PDF to your inbox.

Get my free audit
CallGet a quote