0

For some reason the image is still repeating for me when I open in Gmail. (I have the enclosing statement later in the code.)

   <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 
0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: 
none;hyphens: none;border-collapse: collapse;background-image:${heroBackground};background- 
color:green;background-repeat:no-repeat;background-size:cover;background-position: center;" 
bgcolor="green" background="${heroBackground}" valign="top"> 

<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" 
  style="mso-width-percent:1000">
<v:fill type="frame" src="${heroBackground}" color="#7C64C3" />
<v:textbox style="mso-fit-shape-to-text:true" inset="0,0,0,0">

<div>
<div style="font-size: 0;line-height: 0;margin: 0;border: 0">

<![endif]-->
pitzki
  • 147
  • 1
  • 2
  • 10

2 Answers2

2

It's a typo on my part. The CSS BG property is missing syntax. e.g. url('').

pitzki
  • 147
  • 1
  • 2
  • 10
  • This is the correct answer. And in such cases (with invalid CSS), Gmail will remove the entire `style` attribute, leaving you only with the fallback `background` attribute, making the image repeat itself. – HTeuMeuLeu Mar 16 '21 at 08:11
-1

Here you have this question answered: Gmail HTML email background

There are different facts when coding for email on every single CSS property. Here, as they say, could be Gmail does not recognize background-position so you should use the background shorthand property.

Pablo C
  • 62
  • 1
  • 7