Definition
Conditional HTML comments are Microsoft-specific markup that lets email developers apply styling and content only to Outlook for Windows. Outlook renders email with the Word engine rather than a standard browser, so it ignores many modern CSS properties that work everywhere else. Conditional comments provide a workaround: Outlook processes the code between the comments, and every other client treats it as a comment and skips it.
The primary syntax is <!--[if mso]> ... <![endif]-->. Because it is a comment to every other client, conditional markup adds no visible overhead outside Outlook — making it the standard tool for Outlook-specific fixes.
Common Outlook Fixes Using Conditional Comments
mso-hide: all— hide elements that break Outlook layouts- Outlook-specific padding — apply padding Outlook understands that other clients ignore
- VML buttons — render rounded buttons in Outlook using Vector Markup Language
- Table width fixes — set widths Outlook respects that standard CSS ignores
- Fallback fonts and colours — target Word rendering quirks
Example
<!--[if mso]>
<table role="presentation" width="600" cellpadding="0" cellspacing="0" style="width:600px;">
<tr><td>
<![endif]-->
<div style="max-width:600px; margin:0 auto;">
<!-- content visible to all clients -->
</div>
<!--[if mso]>
</td></tr>
</table>
<![endif]-->
In this pattern, Outlook sees the table wrapper while standard email clients see only the div. The result is consistent width across Outlook and modern clients.
Best Practices
- Use
<!--[if mso]>rather than<!--[if !mso]>— target Outlook specifically, not every other client - Keep conditional blocks minimal — large duplicated blocks are hard to maintain
- Test in Outlook before sending — Outlook still holds meaningful share in B2B environments
- Combine with a mobile-first base — conditional comments handle Outlook while a responsive design handles the rest
- Remove conditional markup from text versions — they serve no purpose in plain text
Was this useful?
Related Glossary Terms
Above the Fold in Email
Above the fold in email refers to the content visible to a recipient before they scroll, a critical area for first impressions and primary calls to action.
Accessible CTA (Email)
An accessible CTA is a button or link coded with sufficient colour contrast, visible focus states, descriptive screen-reader text, and a minimum touch target of 44×44 pixels.
Adaptive Design
Adaptive design in email uses predefined layouts that adjust to specific device or client widths, rather than fluidly resizing to every possible screen.
AI-Generated Content in Email
AI-generated content in email is copy, images, code or subject lines produced by artificial intelligence tools to speed up campaign production and testing.
Alt Text
Alt text is the written alternative to an image in an email, displayed when images are blocked, slow to load, or consumed by screen readers.
AMP for Email
AMP for Email is a technology that allows interactive, dynamic content to live inside an email message, enabling forms, carousels and live updates.
Frequently Asked Questions
Outlook for Windows uses Microsoft Word's HTML rendering engine rather than a browser engine. Word lacks support for many modern CSS properties like flexbox, grid, custom fonts and certain positioning rules, so email that renders perfectly in Apple Mail or Gmail can break in Outlook.
No. Conditional comments are written as HTML comments (``), which every other client ignores completely. Only Outlook's Word engine processes the conditional syntax, so the markup is invisible elsewhere.
Yes, particularly in B2B. Microsoft Outlook remains a significant share of desktop email clients in corporate environments, where many buyers read and act on email. For consumer-focused campaigns, Outlook support can be deprioritised.
Vector Markup Language (VML) is a Microsoft XML format used inside conditional comments to draw shapes Outlook understands. It is commonly used to create rounded, padded buttons in Outlook where standard CSS border-radius fails.