How do I remove link underlining in my HTML email?

114,621

Solution 1

<a href="#" style="text-decoration:none !important; text-decoration:none;">BOOK NOW</a>

Outlook will strip out the style with !important tag leaving the regular style, thus no underline. The !important tag will over rule the web based email clients' default style, thus leaving no underline.

Solution 2

I see this has been answered; however, I feel this link provides appropriate information for what formatting is supported in various email clients.

http://www.campaignmonitor.com/css/

It's worth noting that GMail and Outlook are two of the pickiest to format HTML email for.

Solution 3

After half a day looking into this (and 2 years since this question was opened) I believe I have found a comprehensive answer to this.

<a href="#"><font color="#000000"><span style='text-decoration:none;text-underline:none'>Link</span></font></a>

(You need the text-underline property on the span inside the link and the font tag to edit the colour)

Solution 4

Use !important in the text decoration rule.

<a href="#" style="text-decoration:none !important;">BOOK NOW</a>

Solution 5

Another way to fool Gmail (for phone numbers): use a ~ instead of a -

404-835-9421 --> 404~835~9421

It'll save you (or less savvy users ;-) the trip down html lane.

I found another way to remove links in outlook that i tested so far. if you create a blank class for example in your css say .blank {} and then do the following to your links for example:

<a href="http://www.link.com/"><span class="blank" style="text-decoration:none !important;">Search</span></a>

this worked for me hopefully it will help someone who is still having trouble taking out the underline of links in outlook. If anyone has a workaround for gmail please could you help me tried everything in this thread nothing is working.

Thanks

Share:
114,621
pubudumj
Author by

pubudumj

Updated on October 26, 2020

Comments

  • pubudumj
    pubudumj over 3 years
    <td width="110" align="center" valign="top" style="color:#000000;">
        <a href="https://example.com" target="_blank"
           style="color:#000000; text-decoration:none;">BOOK NOW
        </a>
    </td>
    

    I used this code to make a link in my HTML email. In browsers and Outlook it's working nicely, but in GMail, Hotmail, and ymail it shows links underlined.

    Can anyone help me to get rid of this?