1 Reply Latest reply on Jun 11, 2018 8:56 AM by Courtney Grimes

    Background-size not working

    Scott Miller

      Hi All,

       

      I am having a small issue that I can't seem to find an answer to...

      I am trying to have a background image stretch to cover the table's <td>. I am using the background-size css property (background-size: cover) to make the image stretch and cover the entire background. While in the editor, all looks correct, however, when I send a sample to test it out, the image is repeating and when I inspect the code (using chrome inspector) the background-size property has been removed...below is the code that I am using in the editor (code in question is bold).

       

      <td class="background" style="-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;-ms-text-size-adjust: 100%;margin-left: auto;vertical-align: middle;margin-top: 0;margin-right: auto;margin-bottom: 0;background-image:${gifvidBackgroundImage};background-repeat: no-repeat; background-size: cover; background:${gifvidBackgroundImage};background-color:${gifvidBackgroundColor};border-collapse: collapse;" background="${gifvidBackgroundImage}" bgcolor="${gifvidBackgroundColor}" valign="middle">

       

      I have attached screenshots of the editor (correct) and the sample email (gmail) that shows how the background is being repeated (incorrect). Is there anything that I am missing to have this work correctly.

       

      Thanks