gap in Apple Mail iOS

SupportedWebKit · mobile

Support Details

Use padding/margin on child elements instead of gap.

Before

<div style="display: flex; gap: 16px;">
  <div>Item 1</div>
  <div>Item 2</div>
  <div>Item 3</div>
</div>

After

<table role="presentation" cellpadding="0"
  cellspacing="0" border="0">
  <tr>
    <td style="padding-right: 16px;">Item 1</td>
    <td style="padding-right: 16px;">Item 2</td>
    <td>Item 3</td>
  </tr>
</table>

Use padding or margin on child elements instead of gap

gap is fully supported in Apple Mail iOS. No workarounds needed.

Other Clients

Client	Support
Gmail	Partial
Gmail Android	Partial
Gmail iOS	Partial
Outlook 365	Partial
Outlook (New)	Unsupported
Outlook Classic	Unsupported
Outlook iOS	Partial
Outlook Android	Partial
Apple Mail	Supported
Yahoo Mail	Unsupported
Samsung Mail	Supported
Thunderbird	Supported
HEY Mail	Supported
Superhuman	Supported

Related Features

!important accent-color align-items animation aspect-ratio backdrop-filter

Test your email across all 15 clients

Preview rendering, catch CSS issues, and get actionable fixes — free.

Try Emailens Free