Search code examples
htmlcssoutlookanchorhtml-email

outlook anchor tag underline doesn't work


i'm going to be crazy about this. I'm trying to remove the underline inside my anchor tags in my page. I've tried all the solutions around the web but non of them is works.

This is the code that i'm using for tests. I've tried putting !important to text-decoration, i've tried to but a conditional style just for outlook, I tried to put the text in the a tag inside a span, but none of them still works. Seeing the html in the ooutlook app, it does displays correctly, but when i'm trying to see it on the outlook from browser, it doesn't work, i still see the underlined text.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>{0}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <style type="text/css">

    </style>
  </head>
  <body style="margin: 0; padding: 0;">
   <span>
     <a href="http://www.w3.com" style="text-decoration: none">TEST</a>
   </span>
  </body>
</html>

Someone that knows how to avoid that?


Solution

  • text-decoration:none is pretty well supported in most email clients. And I ran a test of your code in Email on Acid, and I'm not seeing any problem with it.

    Could you maybe give more details like: how you're sending your HTML email and which version of Outlook are using exactly.