Ghost CMS Newsletter Not Sending to Subscribers: The CSS Fix Nobody Tells You

Quick answer: When a Ghost newsletter sends as a test but fails for actual subscribers, the most common culprit is modern CSS that Juice (Ghost's CSS inliner) can't process — especially the CSS nesting & selector. Strip modern CSS from posts you want to email, and the issue resolves immediately.

Here's a scenario that hits more Ghost users than you'd think: you write a post, hit publish, choose "send to all subscribers" — and the email just doesn't arrive. Your test email worked perfectly. The Ghost admin shows no obvious error. Yet your subscribers never got the newsletter.

You go digging through your logs and find something like this: TypeError: Cannot read properties of undefined (reading 'match'). That cryptic message tells you almost nothing useful. So you spend hours checking your Mailgun settings, your DNS records, your subscriber list — and find nothing wrong.

The actual problem is buried in your post's HTML. Ghost runs your content through a library called Juice before sending to subscribers. Juice inlines all your CSS so email clients can render it. But Juice was built for older CSS specs. The moment it hits a feature it doesn't understand — like the CSS nesting & selector or other modern syntax — it chokes and fails silently.

Why does the test email work but the newsletter doesn't send?

Ghost's test email (the "Send yourself a test" button) renders differently than the bulk newsletter send. Test emails go through a lighter rendering path — they're quick, direct, and skip some processing steps. The full newsletter send goes through Juice's complete inlining process, which is where failures happen.

This means you can have a post that looks perfect in test mode but breaks completely when you hit "send newsletter." It's one of the most confusing issues on the Ghost forum precisely because the test succeeds.

Email Path	Uses Juice	Can Fail from CSS?
Test email (from post editor)	Partial	Rarely
Transactional email (magic links, welcome)	No	No
Newsletter to subscribers (bulk send)	Full	Yes

What CSS features break Ghost's email newsletter?

The main offender is CSS nesting using the & selector. This is valid modern CSS that works in all recent browsers, but Juice doesn't know how to flatten it into inline styles. Other features that can cause issues:

• CSS nesting (& .child {}, &:hover {})
• Container queries (@container)
• CSS :has() selector
• Cascade layers (@layer)
• CSS custom properties in complex calc()
• Logical properties (margin-inline, padding-block)

The error you'll see in Ghost logs is almost always the same: TypeError: Cannot read properties of undefined (reading 'match'). It's Juice crashing when it encounters something it can't parse. Ghost catches the error but doesn't surface it clearly in the admin UI — your post just shows as "Published" with no newsletter sent.

If you're troubleshooting Ghost email delivery more broadly, the Ghost confirmation email going to 404 guide covers another class of email issues worth checking.

How do I find which CSS is breaking the newsletter?

There's no built-in Ghost tool to pinpoint the problematic code. Here's the fastest approach:

1. Check your Ghost logs. On self-hosted installs: ghost log or check /var/www/ghost/content/logs/. Look for the Juice error around the time you tried to send.
2. Copy your post HTML from the editor (use the HTML card or export). Paste it into an AI assistant with your log file and ask it to find CSS incompatible with email inlining.
3. Binary-search your content. Delete half the post, try sending again. If it works, the problem is in the removed half. Repeat until you find the block.
4. Search for & in HTML cards. The nesting selector is the most common culprit. A simple find-and-replace in your HTML card will reveal it.

Once you've identified the block, you have a choice: remove the modern CSS, rewrite it in a compatible way, or keep it and work around the timing issue (see below).

How do I fix CSS nesting in Ghost posts for email?

The straightforward fix is rewriting nested CSS as flat rules:

/* BEFORE — breaks Juice */
.card {
  background: #fff;
  & .title {
    font-size: 1.2em;
  }
  &:hover {
    background: #f5f5f5;
  }
}

/* AFTER — email-safe */
.card {
  background: #fff;
}
.card .title {
  font-size: 1.2em;
}
.card:hover {
  background: #f5f5f5;
}

For any inline style attribute (not a stylesheet), just avoid nested references entirely. Use direct property declarations:

<!-- BEFORE (breaks) -->
<div style="background:#fff; & span { color:red; }">...</div>

<!-- AFTER (works) -->
<div style="background:#fff;"><span style="color:red;">...</span></div>

If you use code injection in Ghost, keep it in a <style> tag inside the Site Header injection (not in post HTML cards), and avoid modern CSS features there too. Ghost processes code injection separately, but complex CSS in post content goes through Juice every time.

For Ghost CMS users managing multiple email customizations, check the Ghost comments setup guide — you'll find similar patterns around HTML compatibility worth knowing.

What's the workaround if I don't want to change my post design?

If you want to keep the modern CSS for the web version of your post but still send the newsletter, here's the cleanest workaround:

1. Publish a simplified version first. Strip the modern CSS from the post, publish it, and send the newsletter. Your subscribers get a clean readable email.
2. Re-edit the post after it's been emailed. Add back the modern CSS for the web version. The newsletter has already been sent, so Juice won't touch this post again.
3. Mark it clearly. Add a note in your workflow or use Ghost's post notes feature so you remember this post has already been emailed.

This two-step approach is exactly what the Ghost forum community has landed on as the practical fix. It's not elegant, but it works and doesn't require any custom code.

Ghost's Mailgun alternatives guide also shows how different email providers can affect deliverability — worth reading if you're troubleshooting beyond just the CSS issue.

How do I check if my Ghost newsletter is actually sending?

Ghost's admin UI can be misleading — "Published" doesn't always mean "emailed." To verify your newsletter sent:

• Go to Ghost Admin → Posts, open the post, and look for the "Sent to X members" confirmation in the post header or side panel.
• Check Mailgun's dashboard under Logs → Messages. If the bulk send triggered, you'll see a batch of outgoing messages timestamped around publish time.
• Check your Ghost logs for any error lines. A clean send has no errors. A Juice crash shows the TypeError.
• Check Ghost Admin → Settings → Email newsletters to confirm the newsletter is enabled and connected to Mailgun.

If your Mailgun logs show zero messages around publish time, Ghost never handed off the email — which points back to the Juice rendering failure, not a Mailgun issue.

Self-hosted Ghost users running into 500 errors during email sends should also read the Ghost 500 Internal Server Error guide for overlapping causes.

Does Ghost have plans to fix Juice compatibility with modern CSS?

The Ghost core team is aware of Juice limitations, and the library itself (maintained by Automattic) does receive updates. However, email client CSS support is a fundamentally fragmented problem — Microsoft Outlook, Gmail, Apple Mail, and others all have different CSS subsets they support.

Juice has to target the lowest common denominator to ensure emails render broadly. That means CSS features shipped in browsers in 2023-2025 won't be Juice-supported for a while. Ghost's newsletter template itself is designed to be email-safe, but HTML cards in your post content are user-controlled — Ghost can't prevent you from putting incompatible CSS there.

The practical answer: don't rely on modern CSS in content you want emailed. Use modern CSS freely on your Ghost theme, but treat email content like it's 2015 CSS.

For broader Ghost performance questions, the Ghost PageSpeed Insights guide covers CSS optimization from a different angle.

Can I use the Ghost API to check newsletter send status?

Yes. The Ghost Admin API exposes email send data on posts. You can query a specific post and check the email field:

curl https://YOUR-SITE.com/ghost/api/admin/posts/POST_ID/?include=email   -H "Authorization: Ghost YOUR_TOKEN"

The response includes an email object with status (should be submitted if it went out), email_count, delivered_count, and failed_count. If email is null on a post that should have been emailed, it means the send never happened — another confirmation of a rendering failure upstream.

The Ghost + n8n integration guide has more on working with the Ghost API programmatically if you want to build automated monitoring around this.

Related Ghost Guides

• Ghost CMS Mailgun Alternatives — if you're hitting Mailgun limits or looking for cheaper sending options
• Ghost CMS with Amazon SES — setting up SES as your email provider step by step
• Ghost CMS 500 Internal Server Error — related server-side errors that can block email sending
• Ghost Confirmation Email Goes to 404 — different email failure mode, same troubleshooting mindset
• Improving Ghost PageSpeed Score — CSS optimization that also helps email rendering
• Ghost CMS + n8n Integration — automate email monitoring and alerts via API
• Adding Comments to Ghost CMS — another HTML compatibility area worth reviewing

Frequently Asked Questions

Why does my Ghost test email send but not the newsletter?

Test emails skip some of Ghost's CSS inlining process. The full newsletter send runs your post through Juice, which inlines CSS for email clients. If your post contains modern CSS Juice can't parse — especially the & nesting selector — Juice crashes and the send fails silently.

What does "TypeError: Cannot read properties of undefined (reading 'match')" mean in Ghost?

This error appears in Ghost logs when Juice (the CSS inliner) encounters CSS it can't process. It's not a helpful error message — it just means something in your post's HTML or CSS broke the inlining step. Check for nested CSS selectors, container queries, or other modern CSS in your HTML cards.

How do I find which CSS is causing Ghost newsletter failures?

Check your Ghost logs for the Juice error, then copy your post HTML and paste it into an AI assistant to identify incompatible CSS. You can also binary-search by removing half your content, testing the send, and narrowing down the problem block.

Is CSS nesting supported in Ghost email newsletters?

No. Ghost uses Juice to inline CSS before sending newsletters. Juice doesn't support CSS nesting (the & selector). Always write flat, explicit CSS rules for content you plan to email.

Can I use modern CSS in Ghost themes?

Yes — your theme's CSS is applied to the web version only and doesn't go through Juice. You can use any modern CSS in your theme files. The restriction applies only to CSS inside post HTML cards that get emailed to subscribers.

How do I check if a Ghost newsletter was actually sent?

Check your Mailgun dashboard for outgoing messages around the publish time. Also query the Ghost Admin API for the post's email field — if it's null, the newsletter was never handed off to Mailgun. You can also review Ghost logs for any error lines during the send window.

What CSS is safe to use in Ghost newsletter content?

Stick to CSS that email clients have supported since roughly 2015: flat selectors, font-family, color, background-color, padding, margin, border, basic display values. Avoid nesting, :has(), container queries, @layer, and logical properties. The site caniemail.com is your reference for what's actually safe.

Will Ghost fix the Juice library issue?

Ghost depends on the Juice library, which is a separate open-source project. Juice support for modern CSS improves over time, but email client fragmentation means the library will always be behind browser CSS support. Don't plan your newsletter content around features landing in Juice — treat email CSS as a separate, constrained problem.

How do I send a newsletter in Ghost after I've already published a post?

Ghost doesn't let you re-send a newsletter to the same post easily. The workaround most users use: unpublish the post, then re-publish it with the "send newsletter" option. Be aware this changes the publish date. Alternatively, create a new short post that links to the original, and email that instead.

The cleaner approach for your next post: plan the email version separately from the web version. Write email-safe content first, send, then enhance the web version with modern CSS after the newsletter goes out.