I'm creating an email signature in Microsoft Outlook. I'm aware that the formatting will never be 100% consistent across all email readers, but I'd settle for the most used platforms in our company displaying them correctly: Outlook, Gmail and Apple Mail.
The problem is links. Using a custom colour on links works without a hitch when the email is received in Outlook. Gmail and Apple Mail, however, colour the text your custom colour, but the underline reverts to the default browser blue or purple.
I would settle for either of these two outcomes:
- Removing the underline from links.
- Having the same underline colour as the text.
I have been up and down the internet and cannot find a solution that works. Many say they have a fix, but articles and comments are dated from 2012 or 2014. Obviously, Gmail and Apple Mail have evolved since then.
Last year Gmail started supporting responsive design in emails, allowing <style>
tags to be added to the <head>
section. Surely it should be possible to crack this now?
I've tried every little trick I could find, wrapping my link in a <span>
, wrapping the <span>
in the link. I've tried similar tricks with and without the <font>
tag. Basically I have tried every nested and redundant combination of these. Here's a sample of my last effort:
<body link="#59b5ba" alink="#59b5ba" vlink="#59b5ba" text="#59b5ba">
<a href="#" style="color:#59b5ba;text-decoration:none;text-decoration-color:#59b5ba;-webkit-text-decoration-color:#59b5ba;">
<span style="color:#59b5ba;text-decoration:none;text-decoration-color:#59b5ba;-webkit-text-decoration-color:#59b5ba;">
<font color="#59b5ba">
Link
</font>
</span>
</a>
</body>
It should also be noted that I've tried text-decoration:underline
as well with the same result.
Has anyone successfully managed to remove the underline or make the line colour match the text?