Skip to content

Troubleshoot HTML emails

Use this page to resolve common HTML email editor and test-send issues. For Inbox Vision and deliverability, see Inbox Vision and Email setup.

Start here: Match your symptom

Match your symptom in the table to navigate to the relevant section.

Symptom Go to
Test email HTML looks wrong HTML renders incorrectly in test emails
Editor behaves oddly in Chrome Extension conflicts
Email looks different across clients Email rendering
Inbox Vision preview doesn’t match sent email CSS inlining
White space or lines after images in test emails White space under images

Standard investigation path

Use this workflow when HTML email rendering or editor behavior doesn’t match what you expect. Start at step 1.

  1. Validate your HTML markup in the editor or an external validator.
  2. Send a test email and note which email clients or browsers show the issue.
  3. Preview with Inbox Vision to compare rendering across clients.
  4. Rule out browser extension conflicts if the editor itself misbehaves.
  5. If the issue persists, open a support ticket with screenshots from Inbox Vision and the affected clients.

HTML renders incorrectly in test emails

Symptom: A test email doesn’t match what you expect from the editor.

Check your HTML setup first, then review extension conflicts, email rendering, CSS inlining, and white space under images.

Extension conflicts

Certain browser extensions may cause issues with the email editor. One example is Grammarly when used with Google Chrome. If you’re using one of these extensions, you should either:

  • Edit Braze emails in a browser that does not have Grammarly as a browser extension
  • Contact your Braze account manager and ask to switch your email editors to HTML only or plain text.

The plain text view removes your WYSIWYG (what you see is what you get) editor, so you should first confirm that all team members are comfortable with HTML before making this request.

Email rendering

Emails render differently depending on browsers and email clients, so take note of which browsers and email clients you’re experiencing issues with.

  • Preview your emails using Inbox Vision to see what your emails look like in different browsers and email clients.
  • After you’ve identified which browsers or email clients are causing issues, let your developer team know that they’ll need to modify their HTML and make edits to accommodate those browsers or email clients.

CSS inlining

There are times when the previews in Inbox Vision still don’t match what is sent with Braze. This may be caused by the difference in CSS inlining performed by Braze and by other tools. If you suspect that this is the case, turn off CSS inlining.

White space under images

Symptom: White space or lines appear after images in test emails.

If you notice white space or lines appearing after images in your test emails, this is typically caused by how email clients render inline-level elements. Images are inline-level by default and are aligned to the baseline, which allows browsers to accommodate descenders (the part of letters like “g” or “y” that extend beyond the baseline). This creates a small gap that appears as white space.

To fix this, add display: block; to your image CSS:

1
2
3
4
5

<style>
  img {
    display: block;
  }
</style>

Alternatively, apply the style directly to specific images:

1

<img src="https://example.com/image.jpg" style="display: block;" alt="Image description" />
New Stuff!