Outlook email rendering issues: why your images break and how to fix them
Classic Outlook on Windows renders HTML email through Microsoft Word's engine, not a browser engine. That one decision behind the software explains most of the display bugs marketers blame on their own code.
A perfectly coded email can still crop its header image or misalign a column the moment it opens in classic desktop Outlook.
First, know which Outlook you are debugging
"Outlook" is now several products with different rendering engines, and the fixes below only apply to one of them.
Client | Rendering engine |
|---|---|
Outlook 2007–2019, Windows desktop | Microsoft Word |
Outlook for Office 365, Windows desktop | Microsoft Word |
New Outlook for Windows | Browser engine |
Outlook for Mac | WebKit |
Outlook.com and mobile apps | WebKit-based |
Outlook on the web | WebKit or Blink |
If your reporter is on the new Outlook for Windows, the Word-engine fixes in this post will not explain what they are seeing — though the gateway and display-scaling causes below still can. Confirm the client before you start changing code.
Why classic Outlook mangles images no other client touches
The Word engine is especially rough on images once high-DPI scaling kicks in on a Windows laptop. A fixed CSS height on that image is what usually triggers the crop.
Litmus's rendering guide names the root issue: Outlook does not support CSS styles for image widths and heights. Without HTML attributes to work from, it falls back to the image's actual file dimensions — which is why a retina asset can blow out a layout that looked fine everywhere else.
The pattern that handles both cases is to set the width as an HTML attribute, so Outlook has a number it respects, and leave the height to CSS, so modern clients scale proportionally:
The display:block is doing real work there. Without it, Outlook adds padding of its own around the image, and that padding is the second common cause of a crop.
A corporate security gateway can be the real cause
Corporate networks route incoming email through a security gateway like Mimecast or Proofpoint before it reaches the inbox. Those gateways inspect and often recompress the images inside. That recompression step can shift an aspect ratio or strip metadata the original file relied on.
An email that renders fine on a home network and breaks the moment someone opens it at the office is a gateway problem, not a client problem. The same gateways also rewrite every link for scanning, so a distorted image is often not the only thing that changed in transit.
Windows display scaling adds a second layer
Most modern Windows laptops ship with display scaling set to 125% or 150% instead of 100%, since the screens are dense enough to need it. Classic Outlook doesn't scale email graphics cleanly under those settings, and a design that ignores it loses a slice of the image at 150%.
Email on Acid's fix adds an Office Document Settings tag to the email's head so Outlook stops converting pixels to points inconsistently across the layout:
Scalero's guide to image formats and sizing for email covers the dimensions that hold up across all three of these variables.
One design pattern to avoid entirely
Designs that place live text over a background image run into a separate problem: classic Outlook does not render CSS background images at all. That block has to ship as one flattened image rather than as text and CSS, or it has to be designed so the text sits beside the image instead of on top of it.
Isolating the cause takes two checks, not a guess
The browser check. An email that displays correctly through "View in Browser" but breaks in desktop Outlook has a rendering-engine problem.
The network check. Have the reporter open the same email on cellular data, off the corporate network. If it renders correctly there, a gateway like Mimecast or Proofpoint was the cause.
Run both before changing any code. The engine, the gateway, and display scaling each distort an image differently, and the fix depends on knowing which one is running.
The bottom line
Outlook's rendering issues rarely have one cause, and in 2026 they rarely have one Outlook either. Confirm the client, then work through the engine, the gateway, and the scaling in that order.
Tired of re-fighting the same crop on every send? Book a template review with Scalero's email coding team, and let them account for all three before your next test send goes out.
