WordPress CSS Not Loading: Why the Site Looks Unstyled

Quick fix: open DevTools, reload with the Network tab recording, and filter by CSS. The failing request and its status code identify the cause in seconds; everything below is how to fix each specific status.

Read the failing request

If the stylesheet loads with a 200 and real CSS in it, then the styles are arriving and something else is overriding them — jump to the specificity section at the end.

Wrong site URLs after a migration

The most common cause. WordPress builds asset URLs from siteurl and home, so if they still point at the old domain or the local development address, every stylesheet 404s.

Check Settings → General, or set the values directly in wp-config.php when you cannot reach the admin:

<?php
define('WP_HOME', 'https://example.com');
define('WP_SITEURL', 'https://example.com');

That fixes the current page load immediately. Follow it with a serialisation-aware search-and-replace across the database so content, widgets and options stop referencing the old domain. Do not run a plain SQL REPLACE — it corrupts serialised values.

Mixed content after moving to HTTPS

A page served over HTTPS cannot load a stylesheet over HTTP; the browser blocks it and logs a mixed-content warning in the console.

Fix it at the source rather than with a plugin that rewrites output on every request:

1. Set both URLs to https:// as above.
2. Search and replace http://example.com with https://example.com in the database.
3. Check the theme for hard-coded http:// asset URLs.
4. Purge every cache layer.

The full HTTPS checklist is in how to fix the WordPress not secure warning.

Broken minification or a stale cache

Optimisation plugins concatenate and minify stylesheets into a combined file. When that file is generated during a partial deploy, or one source file contains a syntax error, the merged output can be truncated — the browser gets a 200 and half a stylesheet.

Recovery order:

1. Turn off CSS minification and combination.
2. Purge the plugin cache, then the host cache, then the CDN.
3. Reload in a private window. If styling returns, re-enable one feature at a time to find the breaking one.
4. Exclude the file that breaks rather than abandoning optimisation entirely.

If the plugin cache directory is unwritable, the plugin may serve a link to a file it never wrote. Check permissions on wp-content/cache.

Permissions and blocked directories

A 403 on a stylesheet means the server is refusing to serve it. Check that files are 644 and directories 755, owned by the web server user, then look for security rules blocking /wp-includes/ or /wp-content/. Some hardening guides recommend blocking wp-includes, which breaks core scripts and styles that legitimately live there.

The theme is not enqueueing CSS

If the network tab shows no stylesheet request at all, nothing asked for one. In a classic theme this means wp_enqueue_style() is not running — usually because the wp_head() call was removed from header.php, or a fatal error occurred earlier in the template.

Confirm by viewing source: no <link rel="stylesheet"> tags at all means wp_head() is missing or the page died before it ran. Turn on debug mode to see the error.

For a child theme, make sure the parent stylesheet is enqueued properly:

<?php
add_action('wp_enqueue_scripts', function () {
    wp_enqueue_style('parent-style', get_template_directory_uri().'/style.css');
});

Block themes: styles come from theme.json

Block themes generate much of their CSS from theme.json and from block support settings. If a block theme loses its styling:

• check that global styles have not been reset in Appearance → Editor → Styles;
• confirm theme.json is valid — a JSON syntax error silently discards the whole file;
• look for a plugin dequeuing wp-block-library, which strips core block styles.

Background on the model is in what is a WordPress block theme.

When CSS loads but does not apply

If the file arrives intact and the page still looks wrong, the rules are being overridden. Inspect the element and look at the Styles panel: crossed-out declarations show what won.

Usual causes are a more specific selector in the theme, an inline style from a page builder, or a plugin loading its stylesheet after yours. Raise specificity or adjust enqueue order rather than reaching for !important — the reasoning is in how to add custom CSS to WordPress.