Indeed this is still an issue, and the solution is to move the bgcolor from the body tag to an outer table (which you need anyway for Windows 10 Mail background colour). https://github.com/hteumeuleu/email-bugs/issues/34
Strangely, this didn't work for an issue with Times New Roman on lists (the first number of an ol was ignoring font-family and color, but the following worked (not even adding a class worked):
<!--[if mso]>
<style type="text/css">
.MsoNormal {font-family: Arial, sans-serif !important; color:rgb(75, 88, 105);}
</style>
<![endif]-->
Other answers here now no longer work as Outlook is adding !important inline such that changes in the <style>
section aren't able to override them anymore.
However, you can still cheat by using a single colour gradient for background colours, and -webkit-text-fill-color
for text colours:
<td style="background-color:#ffdd00;background-image: linear-gradient(#ffdd00,#ffdd00);"> <p style="color:#000000;font-weight:bold;text-align: center;-webkit-text-fill-color: #000000">This is a button</p>
I wouldn't recommend using these on everything, as Gmail doesn't listen to it, and it's going against what your users want.
This also works for Outlook on Mac, but it doesn't for Gmail
Some emails are not swapping because of images in the email. Apple is taking a cautious approach.
However, to disable it, you simply add this to your head section:
<meta name="color-scheme" content="light only">
This is saying that your email only supports the light mode. (It would be "light dark" if you supported both.)
However, this won't affect Outlook on Mac, or Gmail dark mode (currently not testable on Litmus?!). So it's best to go with the flow, and cater to your users desires. It's like insisting that users use a desktop, and not providing a responsive design.
This is a common 'feature', not specific to Outlook. What you need to do is add some non-visible code in there and the easiest way is to use ‌
You insert this character to break up the pattern. So, for example:
www‌.deadlink.‌com
That should do the trick. It would probably recognise deadlink.com as well as anything with www or http://, so these need to be broken up by the "zero width non joiner" character, which doesn't show visually (there are other options but that's just what I use).