Skip to main content
CSS Properties

background-size

CSS property · 11 supported, 2 partial, 2 unsupported across 15 clients

Client Support

ClientCategoryEngineSupport
GmailwebmailGmail WebSupported
Gmail AndroidmobileGmail MobilePartial
Gmail iOSmobileGmail MobilePartial
Outlook 365webmailOutlook WebSupported
Outlook (New)desktopOutlook WebUnsupported
Outlook ClassicdesktopMicrosoft WordUnsupported
Outlook iOSmobileOutlook MobileSupported
Outlook AndroidmobileOutlook MobileSupported
Apple MaildesktopWebKitSupported
Apple Mail iOSmobileWebKitSupported
Yahoo MailwebmailYahooSupported
Samsung MailmobileSamsungSupported
ThunderbirddesktopGeckoSupported
HEY MailwebmailWebKitSupported
SuperhumandesktopBlinkSupported

Client-by-client behaviour for background-size

Fully supports background-size (11): Gmail, Outlook 365, Outlook iOS, Outlook Android, Apple Mail, Apple Mail iOS, Yahoo Mail, Samsung Mail, Thunderbird, HEY Mail, Superhuman.

Partial support (2): Gmail Android, Gmail iOS. Expect rendering quirks unique to each engine — partial support typically means a subset of values, an ignored shorthand, or sanitizer-specific rewrites.

No support (2): Outlook (New), Outlook Classic. Plan fallbacks for these clients before relying on background-size in production sends.

Fixes & Workarounds

Outlook (New)

Unsupported

Not supported in many clients. Set image dimensions directly.

Before

<td style="background: url('bg.jpg') center/cover no-repeat;">
  Content
</td>

After

<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true"
  stroke="false" style="width:600px; height:400px;">
  <v:fill type="frame" src="bg.jpg" />
  <v:textbox inset="0,0,0,0">
<![endif]-->
<td style="background: url('bg.jpg') center/cover no-repeat;
            background-color: #333;">
  Content
</td>
<!--[if gte mso 9]>
  </v:textbox>
</v:rect>
<![endif]-->

Outlook ignores background-size — use VML or sized images

Outlook Classic

Unsupported

Not supported in many clients. Set image dimensions directly.

Before

<td style="background: url('bg.jpg') center/cover no-repeat;">
  Content
</td>

After

<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true"
  stroke="false" style="width:600px; height:400px;">
  <v:fill type="frame" src="bg.jpg" />
  <v:textbox inset="0,0,0,0">
<![endif]-->
<td style="background: url('bg.jpg') center/cover no-repeat;
            background-color: #333;">
  Content
</td>
<!--[if gte mso 9]>
  </v:textbox>
</v:rect>
<![endif]-->

Outlook ignores background-size — use VML or sized images

Gmail Android

Partial

Not supported in many clients. Set image dimensions directly.

Before

<td style="background: url('bg.jpg') center/cover no-repeat;">
  Content
</td>

After

<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true"
  stroke="false" style="width:600px; height:400px;">
  <v:fill type="frame" src="bg.jpg" />
  <v:textbox inset="0,0,0,0">
<![endif]-->
<td style="background: url('bg.jpg') center/cover no-repeat;
            background-color: #333;">
  Content
</td>
<!--[if gte mso 9]>
  </v:textbox>
</v:rect>
<![endif]-->

Outlook ignores background-size — use VML or sized images

Gmail iOS

Partial

Not supported in many clients. Set image dimensions directly.

Before

<td style="background: url('bg.jpg') center/cover no-repeat;">
  Content
</td>

After

<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true"
  stroke="false" style="width:600px; height:400px;">
  <v:fill type="frame" src="bg.jpg" />
  <v:textbox inset="0,0,0,0">
<![endif]-->
<td style="background: url('bg.jpg') center/cover no-repeat;
            background-color: #333;">
  Content
</td>
<!--[if gte mso 9]>
  </v:textbox>
</v:rect>
<![endif]-->

Outlook ignores background-size — use VML or sized images

Production guidance for background-size

background-size is a CSS property. Across the email client matrix, 11 of 15 tracked clients support it fully, 2 only partially, and 2 not at all. The clients most likely to require a workaround for this feature are Outlook (New), Outlook Classic, Gmail Android. Each of them needs a tailored fallback — see the per-client examples above for the specific code fix Emailens recommends.

When in doubt, ship a baseline that renders without background-size and treat it as progressive enhancement on clients where support is verified. Emailens automatically detects cross-client divergence on this feature when you preview an email, so you can see exactly which template paths break before a campaign goes out.

Related Features

Test your email across all 15 clients

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

Try Emailens Free

Support data last updated Apr 27, 2026 · synced from caniemail.com via @emailens/engine.