Why Your Email Signature Breaks in Outlook (and How to Fix It)

Outlook doesn't render email like a browser

Most email signatures are built with modern HTML and CSS — the same tools that power web pages. That works everywhere except the one place it matters most: desktop Outlook on Windows. Since Outlook 2007, Microsoft has rendered HTML email using the engine from Microsoft Word, not a web browser. Word was never designed to lay out web pages, so a signature that looks flawless in Gmail or Apple Mail can fall apart the moment it lands in an Outlook inbox — broken spacing, oversized images, missing colors, and all.

Understanding what Word can and cannot do is the key to a signature that survives everywhere. Here are the failures you are most likely to see, and why they happen.

The most common ways signatures break

Mystery gaps and doubled line spacing

Word adds its own spacing around paragraphs and treats line height differently from a browser. If your signature uses a <p> or <div> for each line, Outlook often inserts extra vertical space, so a tight three-line block balloons apart. The fix is to reset margins explicitly (margin: 0) and control spacing with table cells rather than relying on default paragraph behavior.

Images that appear at the wrong size

Outlook needs an explicit width and height on every image. Leave them off and Word may display the image at its full native resolution — a logo exported at 2x for sharp screens can show up twice as large as intended. Worse, Outlook ignores many CSS sizing rules, so setting the size in a stylesheet alone is not enough; the dimensions must live on the image tag itself.

Fonts falling back to Times New Roman

Word defaults to a serif font when it cannot resolve your font choice. Web fonts (the kind loaded from Google Fonts) do not load in Outlook at all, and even some system fonts get dropped. If you have ever seen your clean sans-serif signature arrive in Times New Roman, this is why. A web-safe font stack with a reliable fallback prevents it.

Backgrounds and rounded corners that vanish

CSS background images, gradients, border-radius, box-shadow, flexbox, and grid are largely unsupported. A signature that leans on a colored background block or a rounded avatar will render as plain, square, and colorless in Outlook.

How to build a signature Outlook respects

• Use tables for layout, not divs. Nested tables with fixed widths are the only layout method Word renders predictably. Flexbox and grid are off the table — literally.
• Inline every style. Outlook strips or ignores much of what lives in a <style> block, so put your CSS directly on each element with the style attribute.
• Set image dimensions on the tag. Always include width and height attributes, and export at the exact display size (or use a 2x source scaled down with those attributes for sharpness).
• Choose web-safe fonts. Arial, Helvetica, Georgia, Verdana, and Tahoma render reliably. Provide a full fallback stack ending in a generic family.
• Avoid effects that need a browser. Skip background images, gradients, shadows, and rounded corners, or accept that they will silently disappear for Outlook users.
• Use conditional comments for Outlook-only tweaks. Microsoft's <!--[if mso]--> comments let you feed Outlook its own spacing or fallback fonts without affecting other clients.

Why hand-coding this is so painful

None of these rules are hard individually, but getting them all right at once — and keeping them right across Outlook 2016, 2019, Microsoft 365, Outlook for Mac, and the web version, each of which behaves slightly differently — is genuinely fiddly. A single stray margin or missing dimension can undo the whole thing, and you often won't notice until a recipient replies with a screenshot.

This is exactly the problem a purpose-built generator solves. Sigmint outputs table-based, inline-styled HTML with explicit image dimensions and web-safe fonts by default, so the signature you design renders the same in Outlook as it does in Gmail and Apple Mail — without you touching a line of code. If you would rather learn the rules than outsource them, everything above is the short version of what a bulletproof signature requires.

Test before you trust it

Whatever you build, send it to yourself and open it in Outlook specifically before rolling it out to your whole address book. What looks perfect in a design tool is not proof of anything until Word has had its say. Our guide on testing your signature across clients walks through a repeatable checklist so nothing slips past you.