I know this issue has been covered in various posts.
However, I haven't found a working solution among these posts, and I have a problem specific to images containing a link.
My problem appears when the signature passes through the Outlook desktop application, or Outlook Office: Links are automatically underlined despite my many additions of "text-decoration:none" I also tried to put my links in a <span> tag, it didn't change anything.
I kind of gave up on fixing this problem on the coordinates, however the problem also appears on images containing a link, and there it's much more annoying. I end up with an underscore next to my images.
Does anyone have a solution, especially for images?
Perhaps the image should not be considered as text? I don't know if such a thing is possible, I'm a beginner.
Sorry my english is probably bad, but i understand written english very well don't worry ;)
Thanks !
My problem :
(https://i.stack.imgur.com/cupg4.png)
My code :
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="format-detection" content="address=no" />
<meta name="format-detection" content="email=no" />
<title>Signature</title>
<!--[if gte mso 9]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
<!--[if (mso)|(mso 16)]>
<style type="text/css">
body, table, td, a, span { font-family: Arial, Tahoma, Trebuchet, Helvetica, sans-serif !important; }
a {text-decoration: none; color: #0066B1;}
</style>
<![endif]-->
<style>
a[x-apple-data-detectors] {
color: #0066B1 !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
}
u + #body a {
color: #0066B1 !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
}
#MessageViewBody a {
color: #0066B1 !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
}
a, a:link, a:visited { text-decoration: none !important; color: #0066B1; }
body, table, td, a, span { font-family: Arial, Tahoma, Trebuchet, Helvetica, sans-serif !important; }
a {text-decoration: none; color: #0066B1;}
</style>
</head>
<body id="body" style="font-family:'Arial','Tahoma','Trebuchet','Helvetica','sans-serif'">
<table role="presentation" style="padding-left: 8px ; border-spacing:0px">
<tr style="border-collapse: collapse; border-spacing:0px ; height: auto">
<td rowspan="2" style="text-align: right; vertical-align: top; border-spacing:0px ; padding-top: 4px">
<img
src="https://i.postimg.cc/CxnvTpVJ/logo.png"
alt="[LOGO]"
title="Logo"
width="208"
style="width:208px">
</td>
<td style="width: 15px ; padding:0px ; margin:0px; border-spacing:0px"> </td>
<td style="padding: 0px ; text-align: left ; line-height: 1.3 ; font-size: 10pt; border-spacing:0px ; vertical-align: top ; font-family:'Arial','Tahoma','Trebuchet','Helvetica','sans-serif'">
<b>Henri Dupont</b>
<br/>
Directeur d'agence
<br/>
</td>
</tr>
<tr style="border-collapse: collapse">
<td> </td>
<td style="vertical-align: bottom">
<a style="text-decoration: none !important" href="https://qrco.de/">
<img
src="https://i.postimg.cc/jdT6nkhw/add-contact.png"
alt="contact"
title="Ajouter aux contacts"
width="23"
style="width:23px ; text-decoration: none !important ; margin-right: 3px">
</a>
<a style="text-decoration: none !important" href="https://qrco.de/">
<img
src="https://i.postimg.cc/QMghCCNW/web.png"
alt="site"
title="Site internet"
width="23"
style="width:23px ; text-decoration: none !important ; margin-right: 3px">
</a>
<a style="text-decoration: none !important" href="https://qrco.de/">
<img
src="https://i.postimg.cc/PfQp9fmJ/linkedin.png"
alt="linkedin"
title="Linkedin"
width="23"
style="width:23px ; text-decoration: none !important ; margin-right: 3px">
</a>
<a style="text-decoration: none !important" href="https://qrco.de/">
<img
src="https://i.postimg.cc/SRh98JcF/facebook.png"
alt="facebook"
title="Facebook"
width="23"
style="width:23px ; text-decoration: none !important ; margin-right: 3px">
</a>
</td>
</tr>
<tr style="border-collapse: collapse; border-spacing:0px ; height: 10px"></tr>
<tr style="border-collapse: collapse">
<td style="padding: 0px ; margin: 0px ; line-height: 1.3; font-size: 9pt; border-spacing:0px; text-align: right ; vertical-align: top ; font-family:'Arial','Tahoma','Trebuchet','Helvetica','sans-serif'">
<b>Agence Sud-Ouest</b>
<br/>
Pôle d’Activités
<br/>
43, avenue Victor Hugo
<br/>
47000 Villefranche
</td>
<td style="width: 15px ; padding:0px ; margin:0px; border-spacing:0px"></td>
<td style="font-size: 10pt; margin:0px; border-spacing:0px ; border-collapse: collapse ; vertical-align: top ; font-family:'Arial','Tahoma','Trebuchet','Helvetica','sans-serif'" >
<a title= "Téléphoner" href="tel:+33600000000" style="text-decoration: none !important; color: #0066B1 !important">+33(0) 7 00 00 00 00</a>
<br/>
<a style="text-decoration: none !important; color: #0066B1 !important; line-height: 2.1" title= "Téléphoner" href="tel:+33600000000">+33(0) 2 00 00 00 00</a>
<br/>
<a style="text-decoration: none !important; color: #0066B1 !important" title= "Envoyer un mail"
href="mailto:bidule@mailer.de">bidule@mailer.de</a>
<br/>
</tr>
</table>
</body>
</html>What I've tried :
<span> around <a> = don't work
"if mso" = don't work
inline "text decoration: none" = don't work
