All posts
OutlookRendering

How to Make Your Emails Render Correctly in Outlook

13 June 2026 · 7 min read

If an email looks perfect in Gmail but falls apart in Outlook, you are not alone. Classic desktop Outlook renders email using the Microsoft Word engine, not a web browser, so many things that work everywhere else simply do not apply. The good news: a handful of reliable techniques keep your layout intact.

Build the layout with tables

Modern layout tools such as flexbox and grid are not supported. Structure your email with nested tables and a single centred content column of around 600 pixels. Use table cells for spacing and alignment rather than margins, which Outlook often ignores.

Keep every style inline

Outlook and several webmail clients drop or limit styles in the <head>. Put your styling directly on the elements as inline attributes so it survives. A hidden preheader, font colours and spacing should all be inline.

Use MSO conditional comments

Outlook reads special conditional comments aimed at Microsoft Office (MSO). Use them to set a fixed width wrapper and to feed Outlook-only fixes without affecting other clients. This is how professional templates keep a consistent width in Outlook while staying responsive elsewhere.

Make buttons bulletproof

A styled link can collapse in Outlook. Build call-to-action buttons as a table cell with a background colour and padding, so the clickable area and colour render even when rounded corners or gradients do not. Keeping buttons simple and solid is more reliable than chasing pixel-perfect effects.

Avoid what Outlook cannot handle

  • Background images (they often fail without a VML fallback).
  • CSS positioning, negative margins and floats.
  • Web fonts (provide a safe fallback such as Arial or Georgia).
  • Anything that depends on head or external CSS.

Always test before you send

Outlook has many versions and they do not all behave the same. Send a test to yourself and, ideally, preview across clients. Catching a broken layout before the campaign goes out is far cheaper than after.

The simplest way to stay safe is to start from table-based, inline-styled markup in the first place. HTML Email Builder exports exactly that, with the MSO conditionals already in place, so your emails hold up in Outlook without hand-editing the code.

Ready to build your email?

Design it on a 600px canvas and export compliance HTML in minutes.

Open the editor