ASP.NET Core
A set of technologies in the .NET Framework for building web applications and XML web services.
4,748 questions
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(211.20000000000002, 61%, 30%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EBS%3C/text%3E%3C/svg%3E)
Support for external fonts is based on the email reader used.
The text in the html email is not displayed in the installed fonts. Net.Core. SmtpClient.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(3.2, 66%, 10%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EVV%3C/text%3E%3C/svg%3E)
Volk Volk
551
Reputation points
Hi!
The text in the html email is not displayed in the installed fonts, although everything is fine in the html viewer.I use 2 fonts in the email - Raleway and Source Sans Pro.I use SmtpClient to send emails.
To insert fonts, I used: fonts.google.com
I tried to attach 2 fonts with this method, but it still doesn't work: Use multiple @font-face rules in CSS
Mail result in mailbox:
HTML in htmlviewer:
<head>
<title></title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@300&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300&display=swap" rel="stylesheet">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<style type="text/css">
/* CLIENT-SPECIFIC STYLES */
body,
table,
td,
a {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
table,
td {
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
}
img {
-ms-interpolation-mode: bicubic;
}
/* RESET STYLES */
img {
border: 0;
height: auto;
line-height: 100%;
outline: none;
text-decoration: none;
}
table {
border-collapse: collapse !important;
}
body {
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
width: 100% !important;
}
/* iOS BLUE LINKS */
a[x-apple-data-detectors] {
color: inherit !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
}
/* MOBILE STYLES */
@media screen and (max-width:600px) {
h1 {
font-size: 32px !important;
line-height: 32px !important;
}
}
/* ANDROID CENTER FIX */
div[style*="margin: 16px 0;"] {
margin: 0 !important;
}
r1 {
color: #810000;
font-family: 'Raleway', Helvetica, Arial, sans-serif;
letter-spacing: 0.25em;
line-height: 1.65;
margin: 0 0 1em 0;
/* text-transform: uppercase; */
}
s1 {
color: #3c3b3b;
font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
line-height: 1.35;
font-size: 25px;
padding: 10px 15px 20px 15px;
}
</style>
</head>
<body style="background-color: #f4f4f4; margin: 0 !important; padding: 0 !important;">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<!-- LOGO -->
<tr>
<td bgcolor="#545454" align="center">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;">
<tr>
<td align="center" valign="top" style="padding: 40px 10px 40px 10px;"> </td>
</tr>
</table>
</td>
</tr>
<tr>
<td bgcolor="#545454" align="center" style="padding: 0px 10px 0px 10px;">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;">
<tr>
<td bgcolor="#ffffff" align="center" valign="top" style="font-family: 'Raleway', Helvetica, Arial, sans-serif; padding: 20px 10px 10px 10px; border-radius: 2px 2px 0px 0px; ">
<r1 style="font-size: 48px; font-weight: 400; margin: 0;">Welcome {0}!</r1> <img src="https://img.icons8.com/clouds/100/000000/handshake.png" width="125" height="125" style="display: block; border: 0px;" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td bgcolor="#f4f4f4" align="center" style="padding: 0px 10px 0px 10px;">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;">
<tr>
<td bgcolor="#ffffff" align="left" style="font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; padding: 10px 15px 20px 15px; ">
<s1>We're excited to have you get started. Please confirm your account. Just press the button below.</s1>
</td>
</tr>
<tr>
<td bgcolor="#ffffff" align="left">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#ffffff" align="center" style="padding: 10px 15px 30px 15px;">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center" style="font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; border-radius: 3px;" bgcolor="#810000">
<s1>
<a href="{1}" target="_blank" style="
color: #ffffff;
text-decoration: none;
text-decoration: none;
padding: 15px 25px;
border-radius: 6px;
border: 1px solid #810000;
display: inline-block;
">
Confirm Account
</a>
</s1>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr> <!-- COPY -->
<tr>
<td bgcolor="#ffffff" align="left" style="font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; padding: 10px 15px 20px 15px;">
<s1>If that doesn't work, copy and paste the following link in your browser:</s1>
</td>
</tr> <!-- COPY -->
<tr>
<td bgcolor="#ffffff" align="center" style="font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; padding: 10px 15px 20px 15px;">
<s1>
<a href="{1}" target="_blank" style="color: #545454; ">Link</a>
</s1>
</td>
</tr>
<tr>
<td bgcolor="#ffffff" align="left" style="font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; padding: 10px 15px 20px 15px;">
<s1>If you have any questions, just reply to this email—we're always happy to help out.</s1>
</td>
</tr>
<tr>
<td bgcolor="#ffffff" align="left" style="font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; padding: 10px 15px 20px 15px;">
<s1>Cheers, Co.</s1>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td bgcolor="#f4f4f4" align="center" style="padding: 30px 10px 0px 10px;">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;">
<tr>
<td bgcolor="#ffecd1" align="center" style="font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; padding: 15px 15px 15px 15px; border-radius: 4px 4px 4px 4px; color: #666666;">
<s1>
Need more help?
<a href="{2}" target="_blank" style="color: #545454; ">Contacts</a>
</s1>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Accepted answer
1 additional answer
Sort by: Most helpful
-
Volk Volk 551 Reputation points
2023-01-12T13:46:33.9766667+00:00 As see in these comments, the issue has no solution, since in html email everything is still through the ass.