Outlook Mobile App in Android Not Respecting Font Colors
Wanted to share an issue we had with OWA (Android in particular) to save some time of others if end up in the same situation.
We had code an email that was working perfectly in all the email clients but had a particular issue with the Outlook Mobile App.
In there the links colors were not being respected, instead it was forced to the usual Blue link color from Outlook.
Our code looked like:
<p style="color:#ff1122;">
<a href="http://litmus.com" style="text-decoration:none; color: #ff1122;">Hello World!</a>
</p>
And that wasn't working, so after a lot of trial and error we discovered that the issue was comming from Outlook changing the colors if the containter and the inner tag were the same color :S
Using a code like this, worked just fine:
<p>
<a href="http://litmus.com" style="text-decoration:none; color: #ff1122;">Hello World!</a>
</p>
Same as this one:
<p style="color:#ffffff;">
<a href="http://litmus.com" style="text-decoration:none; color: #ff1122;">Hello World!</a>
</p>
I can't say exactly why, but so far is the only solution that worked for us (we tried with !important and many other options).
So basically having different colors for the outter and inner tags will make the trick.
Hope it helps, and very welcome other solutions!
I noticed this recently thank you for the solution!
I've also noticed that when I open the emails in the Outlook app almost always something is broken (not just the emails I created, but the ones I receive) until I press on the three dots (...) right at the bottom corner of the email. Not sure what that does, but it magically fixes everything including link colours. I guess the first version is like a preview version and when you click the dots you see the full version?
Per our tests that's when you have Conversations enabled (that's by default), and that's true, if you click the 3 dots everything works fine.
Sadly, even if you only get 1 email, it will treat it as a Conversation, and everything is messed, and we can't afford people to be thinking on clicking the 3 dots.
But well, this is the solution I found so far that works in all scenarios (conversations on/off, expanded/collapsed).
Will keep updated if I found anything else that's helpful.
And glad it helped you!
I've always just styled text using the
<td>
instead of the<p>
tag and never had an styling issues.Hello,
We have tested and frame out the issue that you have faced.
Beneath are the things which might be help full you.
1. Do not give color in TD and give color only <A> tag.
2. Do not apply!important in <TD> color or <A> color properties. It turns color blue in outlook 2007,10,13,16.
Let us know if any other query.
Thanks
Kevin
Outlook just doesn't work the way it should be...
Thanks for solution