Similar to this question, How do I remove the blue styling of telephone numbers on iPhone/iOS?
I tried the suggestion using following code but it does not work:
[href^="tel"]{
color:inherit;
}
My problem is I am copying a page from my website into an email (weekly newsletter), and gmail is converting it to a blue hyperlink. Even before adding a[href^="tel"], it did not show up as blue on my website. I'm thinking there is no fix since it is happening via google?
if this is happening on gmail app, you can use an anchor tag and give it a color without the href
<a style="color:#000001; text-decoration:none;">iOS Fix</a>
if this is happening on the generic email clients for iOS you can use a class in the header and assign the class to the td
<style>
.appleLinkFix a{color:#000000; text-decoration:none;}
</style>
next you can add the class to the td which iOS will create the link by itself.
<td class="appleLinkFix">48 Pirrama Rd, Pyrmont NSW 2009</td>
Hope that helps answer your question.
Add these styles
color: inherit;
text-decoration: none;
This is also very easy to Google.
Related
a[href^="mailto:"]
{
color: blue;
}
I am using the above code and it's getting applied to both mailto links. Is there any way that we can have two different colors for mailto link? tried SPAN class but not working in Outlook.
try like this
HTML
<body>
232322232
232322232
</body>
css
body{
background-color:#000;
}
a.blue{
color:blue;
}
a.white{
color:white;
}
The recommended way is to have the styles in-lined. This way you are sure that your link colours will work the same across every email clients.
Note: Some answers on this question are either using jquery or CSS in the head. jQuery doesn't work in emails and some email clients strip off <head> ... </head> from your document.
<div style="background-color:#000000;padding:20px 10px;">
Send Mail 1
Send Mail 2
</div>
By default all links are blue. If you wish to change it to a different shade of blue you can use the code similar to the second link.
When I add following code to MailChimp editor it display me correct version, but after sending test email all links become blue.
<span>info#mysite.com</span>
<span style="margin-left: 15px; margin-right: 15px">|</span>
<span>Unsubscribe</span>
</span>
What is interesting that gmail show links blue, but google inbox show correct version.
Any ideas how to solve this issue?
Make anchor tag css as follows
<style>
a {
color: #000000!important; // Black
}
</style>
Change the anchor tag color to whatever you want.
Recently, AOL Mail started ignoring the coding I had been using to override their built-in link styling. The strange thing is that my coding still works for regular links, but not mailto links. Here is the workaround coding that had been working for AOL, Gmail, Outlook, and other mail services that like to insert their own styling for links:
<strong style="font-weight:normal;">fake#fakeURL.com</strong>
Has anyone had any success to fix this new problem with mailto links in AOL?
Try adding a class, like class="mail_link" to your tag and then inside the add a style targeting the tag:
.mail_link {
color: #428BCA !important;
text-decoration: none !important;
}
I am putting a link in email templates and I donot want to underline the link. In Outlook it is working fine but NOT working in Yahoo and Gmail. Sample code is as followed
<p> My paragraph
<b>
<a style="color: #9B0D25; cursor:pointer; text-decoration: none;" href="abc.com">abc.com</a>
</b>
</p>
I tried text-decoration: none !important; but same result. Can any body help me?
Well ... I was forwarding email from outlook to yahoo. While sending mail from Outlook, it discards the property text-decoration: none;. So when I send email directly to Yahoo, it works !!
Do not use paragraphs in HTML email. Move the style attribute of your anchor tag, to after your href attribute. If this does not solve your problem you have a larger issue than can be seen from the code you've provided.
Adding the important tag will actually be less effective because Outlook will ignore any styling that is followed by !important
If you'd like a template to use, check this one out.
This is the code I'm using.
<pre style="cursor: default !important; pointer-events: none !important; font:700 21px Arial; color:#fff!important; margin:12px; text-decoration: none !important;">
info#royalsingapore.com | +65 6417 3059
</pre>
It is rendering as link when sent as an email newsletter from Madmimi.
I want it to be plain text. How to disable render as a link?
I could be wrong, but i believe the fact that is it rendering as a link is up to the website that the email is being viewed on. I bet that the website has a function running on the body of the message that turns anything that looks like a link into an anchored link.
Email systems such as google and specially apple on mobile recognize email addresses and phone numbers and make them clickable. you need to wrap it around in a anchor tag and give it a value of 000001 for example to make it black.