Gmail HTML email background

html css email gmail background-position
jwktje picture jwktje · Mar 19, 2012 · Viewed 15.1k times · Source

I'm working on an HTML email. The problem I get is that GMAIL doesn't use the "background-position" i give it. I have a table with 100% width that has a background that has to be centered. Most clients do this perfectly but Gmail doesn't. Is there a workaround for this?

The inline CSS is like this: (i've split all the background properties up because otherwise most clients don't display it the right way)

<table style="background-repeat: no-repeat; background-position: center top;" border="0" width="100%" align="center" bgcolor="#1E1411" background="assets/mainback2.jpg">

Answer

ognockocaten picture ognockocaten · Oct 9, 2012

It IS possible, you simply have to put all the background style in one line, like so:

background:#1E1411 url(assets/mainback2.jpg) no-repeat center top;

But because some email clients can't handle background images you have to separate the colors.

background:url(assets/mainback2.jpg) no-repeat center top;
background-color:#1E1411;

Related questions

css padding is not working in outlook

I have following html in email template. I am getting different view in MS Outlook and in gmail for the same. <tr> <td bgcolor="#7d9aaa" style="color: #fff; font-size:15px; font-family:Arial, Helvetica, sans-serif; padding: 12px 2…

Read More
Is there an equivalent of CSS max-width that works in HTML emails?

I'm trying to create an HTML email that will display properly in all widely used email clients. I'm wrapping the whole email in a table, and I'd like it to have a width that is up to 98% of the available …

Read More
What tools to automatically inline CSS style to create email HTML code?

When you take a look at http://www.campaignmonitor.com/css/ you learn that you need to embed inline styles in your HTML, in order for your email to be read in any mail client. Do you know any tools …

Read More