Outlook issues

[yourics]

I'm having issues with the formatting in MS Outlook.
For some reason a lot of things are shifted, full width or the e-mail will display like on a phone, while being on a desktop PC.
Everywhere my e-mail displays correctly, except for MS Outlook..

Could somebody PLEASE help me? I have no idea where to start solving this problem.
I've already edited my template so it only contains {{ template "content" . }} as the templating is done in MJML. With the default template it was even worse, so that's why I removed everything except for this one line (of course).
Also is there a way to bypass the dark mode? Some of the colors are displayed incorrectly as you can see.

I've included my .mjml file as well as the generated HTML file by MJML:
Nieuwsbrief Maart 2023.zip

Here are some examples of the correct formatting on outlook web and the wrong formatting on the MS Outlook application.
Correct: https://gyazo.com/9fc848284e5ec57d3bcffbf88d3ac893

Wrong: https://gyazo.com/b2787e9dcbc4072940b803108b035629

[yourics]

Anyone has any idea how to fix this? I have a newsletter that I need to send ASAP. Any help or reply would be appreciated

[candidexmedia]

Outlook is notorious for messing up layouts, and the experience will vary between Outlook desktop, Outlook online, Outlook on certain OSs, etc.

Short-term solution: Your best bet would be to include a "View in browser" link so that Outlook users can view the correct version. Do you know for a fact that a significant portion of your recipients use Outlook?

Long-term: you may need to connect with the MJML community to figure out what the issue is. A quick Google search of "MJML Outlook" shows that others are having issues with getting the framework to work with Outlook:

You can also review the compatibility of the MJML components you used with major email clients: https://mjml.io/faq#email-clients.

More resources:

• Outlook Email Rendering Issues and How to Solve Them
• How to create outlook friendly HTML email?
• The Ultimate Guide to CSS for the most popular mobile, web and desktop email clients
• Outlook HTML Emails: How to Fix 11 Common Rendering Issues
• Outlook Conditional Code

Listmonk-specific Outlook issues

• HTML E-Mail Template is corrupt in Windows - Outlook #1088
• Allow html comments in email-templates static files #1159
• Stripping of HTML comments leads to severe issues on Microsoft Office optimized templates #1273