Updated: New HTML Email Full Page Background Fix (for Outlook & Webmail)

Updated: New HTML Email Full Page Background Fix (for Outlook & Webmail)

Updated: New HTML Email Full Page Background Fix (for Outlook & Webmail)

Bex Osborn

Marketing Strategist

10 Oct 2011

outlook-background Note - this is an improved fix over our previous Outlook background fix This fix is something I've been looking at for a while - and allows html emails to display a full page background image in both outlook 2007 and webmail clients, and for the background image to degrade to a background colour when images are disabled.Whilst you can use the tag to successfully specify a full page background image in Outlook, many webmail clients will ignore this.

This has often meant that both background images and colour are also specified using a full width table, to ensure support in webmail clients.One issue that occurs from this technique, however, is that Outlook will also render the background colour from that full width table, but not the background image, meaning that the solid background colour will display above any full page background image specified on the tag in Outlook.This fix allows you so specify a full width background image that displays in both Outlook and webmail clients , and will fall back to a solid background colour when viewed in any email client with images disabled.Full Snippet:



Download this code snippet Essentially what's happening here is we're wrapping the tag in a

tag that has a background colour.So our content is wrapped in the following elements: This sets the background for webmail clients when images are disabled This sets the background image and colour for Outlook 2007 and other desktop clients.Note that the best control we have over this background image is that it will tile from the top left - more advanced CSS background controls, like background-position or background-repeat aren't supported. Finally a full width table allows us to specify a background image that is supported in webmail clients.Note that adding a background colour to this table will mean that in Outlook 2007, the background colour will show over the background image.So now you should be all set - we've tested this in the major email clients, including Outlook, Gmail, Firefox and Yahoo - if you find any tweaks or use this please let us know below in the comments!

Let’s

create

together

Got a project or want to know more about what we do? Drop us a message here, and we'll get back to you.

Let’s

create

together

Got a project or want to know more about what we do? Drop us a message here, and we'll get back to you.

© 2011-2024 Action Rocket Ltd. All rights reserved.