0

We are developing an email which is displayed properly on all the clients browsers. For Outlook we are using ghost tables as here:

<!--[if mso]>
<table width="100%" valign="middle" style="table-layout: fixed; height: 85px; vertical-align: middle; border: none;">
  <tr>
    <td width="45"><img src="xxx" alt="spacer"></td>
    <td width="105" height="85" valign="middle" style="text-align: center; background: #42a846; color: #fff; vertical-align: middle; border: none;"><p style="height: 75px;font-family: 'Roboto',Helvetica,Arial,sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; border-radius: 3px; background: #42a846; padding: 35px 3px 0px 3px; text-align: center;">SCONTO <br><span style="font-size:18px">%%=v(@percentualeSconto)=%%%</span></p><p style="font-family: 'Roboto',Helvetica,Arial,sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; text-align: center;">CARTA VANTAGGI</p>
</td>
</tr>
<tr><td height="20" style="height: 20px;><img src="xxx" alt="spacer"></td></tr>
</table>
<table align="center" valign="top" role="presentation">
<tr>
   <td height="200" style="white-space: nowrap">
<a href="%%=RedirectTo(@url)=%%" style="text-decoration: none; padding: 0; margin: 0; display: inline-block;"><img src="%%=v(@foto)=%%" alt="Prodotto"></a>
   </td>
</tr>
<tr>
   <td height="80" style="margin:0; valign: top;">
 <p style="font-family: 'Roboto',Helvetica,Arial,sans-serif; font-size: 14px; font-weight: bold; color: #232854; text-align: center; margin:0;">%%=v(@descrizione)=%%</p>
   </td>
</tr>
<tr>
   <td align="center" height="100" width="100%" style="font-size:20px; border-radius: 3px;"><img src="xxx" alt="spacer">
   </td>
</tr>
<tr>
   <td align="top" height="30"><img src="xxx" alt="spacer">
   </td>
</tr>
<tr>
   <td style="white-space: nowrap;>
<a href="%%=RedirectTo(@url)=%%" style="text-decoration: none; padding: 0; margin: 0; display: inline-block;"><p style=" text-decoration: none; font-family:  'Roboto',Helvetica,Arial,sans-serif; font-size: 21px; font-weight: bold; color: #FFFFFF; text-align: center; background-color: #42a846; border: 1px solid transparent; padding: 3px 3px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; line-height: 32px; margin: 0 !important;">%%=v(@prezzoScontato)=%% €</p></a>
   </td>
</tr>
</table>
<![endif]--> 

but the problem is the visualization of these rectangles at the end of the price line. enter image description here

while we would expecting only this:

enter image description here

Please what could be the problem? Thanks in advance.

4
  • You'll have to check on Outlook-specific forums. Jul 26 at 22:59
  • Stack Overflow has a strong HTML email development community that might be a better spot to find help there. Although related, this is not specific to SFMC as it is a more general issue. Jul 27 at 13:01
  • 2
    I'm not understanding why this was migrated to SF Meta?
    – Moonpie
    Aug 1 at 18:28
  • 1
    Unfortunately it appears this question was incorrectly migrated to Meta and I’m unable to move it elsewhere. I believe the best venue for this question is Stack Overflow.
    – David Reed Mod
    Aug 2 at 11:12

0

Browse other questions tagged .