Outsystems reactive email not following preview in IDE
Application Type
Reactive
Service Studio Version
11.14.5 (Build 57418)

Hello


I have been having this issue where I want an email to be shown. Which ofcourse needs to look a bit decent. But now when I make these. They dont seem to follow the preview in OS itself. 


So I have an email. Which is called by a server action. But for example the padding attribute does not work. Also text color is not applied. Is there any cause why it is not following the CSS given? I tried both inline css and classes. 

I use outlook to read my mails. Is it a mailbox issue?

Can I get some help here? Thanks!


If u need some more info please do let me know!

Solution

Rendering content in an email is always hard. Almost no email readers can make use of all CSS classes. Outlook is notorious for this. There is a lot of information for this available. I have found something (dated) that shows you what classes are supported and what not.

https://www.campaignmonitor.com/css/email-client/outlook-2007-16/

I hope this helps.

Greetings,

Vincent

Solution

Hi,

Adding some links with good info about that topic and some workarounds:

https://medium.com/email-design/outlook-rendering-issues-5-tips-to-ensure-your-emails-display-properly-9520b2456166

https://docs.sendgrid.com/ui/sending-email/cross-platform-html-design


Hope this can help. and, by the way, that is not a problem in reactive apps, that happened in Traditional too.


Best regards,

Ricardo Pereira

Solution

Rendering content in an email is always hard. Almost no email readers can make use of all CSS classes. Outlook is notorious for this. There is a lot of information for this available. I have found something (dated) that shows you what classes are supported and what not.

https://www.campaignmonitor.com/css/email-client/outlook-2007-16/

I hope this helps.

Greetings,

Vincent

Solution

Hi,

Adding some links with good info about that topic and some workarounds:

https://medium.com/email-design/outlook-rendering-issues-5-tips-to-ensure-your-emails-display-properly-9520b2456166

https://docs.sendgrid.com/ui/sending-email/cross-platform-html-design


Hope this can help. and, by the way, that is not a problem in reactive apps, that happened in Traditional too.


Best regards,

Ricardo Pereira

Forgot to close this one off. Conclusion is that sometimes it is easier to make some components in my case into images... these then can be equipped with a link on them. Thanks  to you all for the help!

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.