box-sizing in Apple Mail
caniemail.com records no behaviour caveat for box-sizing in Apple Mail, so the support level above is its whole answer for this pair.
Support Details
Account for padding in your width calculations (use padding on a nested element).
Before (Broken)
<div style="width: 300px; padding: 20px;
box-sizing: border-box;">
Content; total width stays 300px
</div> After (Fixed)
<div style="width: 300px;">
<div style="padding: 20px;">
Content; padding on inner element
</div>
</div> Account for padding in width manually (no box-sizing)
box-sizing is fully supported in Apple Mail. No workarounds needed.
Other Clients
| Client | Support |
|---|---|
| Gmail | Supported |
| Gmail Android | Supported |
| Gmail iOS | Supported |
| Outlook 365 | Supported |
| Outlook (New) | Supported |
| Outlook Classic | Unsupported |
| Outlook iOS | Supported |
| Outlook Android | Supported |
| Outlook for Mac | Supported |
| Apple Mail iOS | Supported |
| Yahoo Mail | Unsupported |
| Yahoo Mail Android | Unsupported |
| Yahoo Mail iOS | Unsupported |
| Samsung Mail | Supported |
| Thunderbird | Supported |
| HEY Mail | Supported |
| Proton Mail | Supported |
| AOL Mail | Unsupported |
| Fastmail | Supported |
| Superhuman | Supported |
Related Features
See how Apple Mail renders box-sizing
Preview live screenshots of box-sizing in Apple Mail, Outlook desktop, and Apple Mail side-by-side. Free, no account needed.
Instant live preview · No signup required · 21 email engines
Last tested upstream: · Last synced by Emailens:
caniemail.com (MIT) records Feb 28, 2019 as the last time box-sizing was tested in a real client, 7 years before this sync. Syncing copies that result forward, it does not re-test it. Carried in @emailens/engine data v0.14.5.