5 Replies Latest reply on Apr 16, 2018 3:45 PM by Grégoire Michel

    Banner image alignment to the center

    Andreea Chirica

      Hi. I am using the Flatiron email template. The problem I'm having is that I'd like to center the banner background image rather than left corner top. When trying to apply 'background: center', 'align: center', it centers the banner image on the Marketo editor, but when delivered as a sample on email, the properties aren't kept. It still moves the image to the left corner top (this was checked on both mobile and desktop devices). I'm using Gmail, but it was also checked on Apple mail, and mobile.

       

      This is the current code:

      <td class="background cornertop" 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%;border-top-right-radius: 0px;-webkit-border-top-left-radius: 0px;-moz-border-top-left-radius: 0px;border-top-left-radius: 0px;-webkit-border-top-right-radius:

      0px;-moz-border-top-right-radius: 0px;background-color: #2ea7dc;width: 50%;height: 226px;background-repeat: no-repeat;background-position: bottom left;background:${heroBackgroundImage};background-image:${heroBackgroundImage};padding-top: 0;padding-right: 0;padding-bottom: 0;padding-left: 0;border-collapse: collapse;background-color:${heroBackgroundColor}" height="226" background="${heroBackgroundImage}" bgcolor="${heroBackgroundColor}" valign="middle" width="640">

       

      Could you advise on what code to use in order to be able to center the banner image on both desktop and mobile devices? Let me know if you require more details in order to understand the issue we're having.

       

      Thank you.

      Andreea