CSS font styling for calibri not working on email notification? Resulting font is "

PranavSuj96 · ‎04-11-2019

Hello all,

I have tried to format my notification to be in Calibri 11 but it is not working and the resulting font on the notification when it is sent results in &quot. Not sure what this is, how it came about, and why it would not show Calibri based on my styling. Any help would be appreciated. I have this issue on another notification implemented the same way.

I have copy pasted my notification and styling below. Thanks!

Here is my notification that I have created:

Hello,

Your snapshot is expiring in 2 days.

In normal circumstances we are going to delete the snapshot.

This will mean that the server will remain as it is at the time of deleting the snapshot ${event.parm2}

If you ask us to roll back, the server will be rolled back to the situation when the snapshot was taken in 2 days.

It is possible to extend the snapshot for one single time for an additional 7 days.

Please let us know what to do:

Process normal deletion of snapshot in 2 days (no response).

Integrate
Rollback
Extend

${mailto:mailto.choiceIntegrate}

${mailto:mailto.choiceRollback}

${mailto:mailto.choiceExtend}

Thank you and regards,

….

Here is my html format css

Hello,
Your snapshot is expiring in 2 days.
In normal circumstances we are going to delete the snapshot.
This will mean that the server will remain as it is at the time of deleting the snapshot ${event.parm2}
If you ask us to roll back, the server will be rolled back to the situation when the snapshot was taken in 2 days.
It is possible to extend the snapshot for one single time for an additional 7 days.
Please let us know what to do:
Process normal deletion of snapshot in 2 days (no response).
 
<ol style="list-style-type: decimal; list-style-position: inside; direction: ltr;">
<li style="color: black; font-family: 'Calibri',sans-serif; font-size: 11pt;">Integrate</li>
<li style="color: black; font-family: 'Calibri',sans-serif; font-size: 11pt;">Rollback</li>
<li style="color: black; font-family: 'Calibri',sans-serif; font-size: 11pt;">Extend </li>
</ol>
 
${mailto:mailto.choiceIntegrate}
${mailto:mailto.choiceRollback}
${mailto:mailto.choiceExtend}
 
Thank you and regards,
Takeda IT

Thanks!!

Loudigi · ‎04-11-2019

Hi,

I would recommend a bit of cleanup of the html. Since you are using the same styling for all elements, I would just apply it once to a table and all content inside it will inherit the style. See code sample below. Also, be mindful that no matter what styles you set in your notification, email clients can override and usually do. If the email client (Outlook,Gmail) has set styling for incoming emails, there could be issues. Are you testing the email in Outlook or an email client on the web?

<table style="color: black; font-family: 'Calibri',sans-serif; font-size: 11pt;" width="600" border="0">
  <tbody>
    <tr>
      <td width="304"><p>Hello, </p>
      <p>Your snapshot is expiring in 2 days. In normal circumstances we are going to delete the snapshot.</p>
      <p>This will mean that the server will remain as it is at the time of deleting the snapshot ${event.parm2} If you ask us to roll back, the server will be rolled back to the situation when the snapshot was taken in 2 days. It is possible to extend the snapshot for one single time for an additional 7 days. </p>
      <p>Please let us know what to do: Process normal deletion of snapshot in 2 days (no response). Integrate Rollback Extend </p>
      <p>${mailto:mailto.choiceIntegrate} ${mailto:mailto.choiceRollback}<br>
        ${mailto:mailto.choiceExtend} </p>
      <p>Thank you and regards, </p>
      <p>Takeda IT Thanks!! </p>
      <p>Topics: </p></td>
    </tr>
  </tbody>
</table>