display:flex in Outlook Classic
UnsupportedMicrosoft Word · desktop
Fix & Workaround
Use <table> layouts with <!--[if mso]> conditional comments for Outlook's Word engine.
Before
<div style="display: flex; gap: 16px;">
<div style="flex: 1;">Column 1</div>
<div style="flex: 1;">Column 2</div>
</div>After
<!--[if mso]>
<table role="presentation" width="100%" cellpadding="0"
cellspacing="0" border="0"><tr>
<td width="50%" valign="top">Column 1</td>
<td width="50%" valign="top">Column 2</td>
</tr></table>
<![endif]-->
<!--[if !mso]><!-->
<div style="display: flex; gap: 16px;">
<div style="flex: 1;">Column 1</div>
<div style="flex: 1;">Column 2</div>
</div>
<!--<![endif]-->Use table layout as fallback for flexbox in Outlook
Other Clients
| Client | Support |
|---|---|
| Gmail | Supported |
| Gmail Android | Partial |
| Gmail iOS | Partial |
| Outlook 365 | Supported |
| Outlook (New) | Unsupported |
| Outlook iOS | Supported |
| Outlook Android | Supported |
| Apple Mail | Supported |
| Apple Mail iOS | Supported |
| Yahoo Mail | Supported |
| Samsung Mail | Supported |
| Thunderbird | Supported |
| HEY Mail | Supported |
| Superhuman | Supported |
Related Features
Test your email across all 15 clients
Preview rendering, catch CSS issues, and get actionable fixes — free.
Try Emailens Free