CODEWITHSUNDEEP
c#htmlcssasp.net
Sumedha Vangury
Sumedha Vangury

Reputation: 693

Applying style to <a href> tag placed inside C# code

I am using html code inside a .cs file to design a template for sending emails. I have added style tag to the <a href> tag, but it does not take effect when the email is actually sent. Here is the code:

public static void Email()
{
   StringBuilder sb= new StringBuilder();
   sb.Append("<a href='#' style='font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;color:#fff;text-decoration:none;line-height:2em;font-weight:bold;text-align:center;display:inline-block;border-radius:5px;text-transform:capitalize;background-color:#208ed5;margin:0;border-color:#208ed5;border-style:solid;border-width:10px 20px' target='_blank'>");
   sb.Append("link</a>");
}

Upvotes: 6

Views: 2219

Answers (5)

Rajshekar Reddy
Rajshekar Reddy

Reputation: 19007

The problem is with the way you have constructed your HTML string...

In this code

"<a href='#' style='font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;color:#fff;text-decoration:none;line-height:2em;font-weight:bold;text-align:center;display:inline-block;border-radius:5px;text-transform:capitalize;background-color:#208ed5;margin:0;border-color:#208ed5;border-style:solid;border-width:10px 20px' target='_blank'>"

The style attribute will stop here style='font-family:' since the single quotes which opens the style rules is closed... Hence your other rules are not even considered into this style arrtibute.

Solution: You really dont need to wrap the font-family values in quotes.. you can just say style='font-family:Helvetica,Arial,sans-serif;

If at all you have a font-family name with spaces in it then you have to wrap it in quotes.

Edit 1: If at your font-family name contains space you need to wrap them in quotes.. So you have to wrap the Helvetica Neue in quotes. Add a double quote and escape its meaning using backslash.. Like below..

style='font-family:\"Helvetica Neue\",Helvetica,Arial,sans-serif;

Upvotes: 3

Bhojendra Rauniyar
Bhojendra Rauniyar

Reputation: 85653

Escape the quotes with backslash:

style=\"font-family:\'Helvetica Neue\',Helvetica,Arial,sans-serif;font-size:14px;color:#fff;text-decoration:none;line-height:2em;font-weight:bold;text-align:center;display:inline-block;border-radius:5px;text-transform:capitalize;background-color:#208ed5;margin:0;border-color:#208ed5;border-style:solid;border-width:10px 20px\"

Upvotes: 7

user31782
user31782

Reputation: 7587

You can't nest single quotes inside single quotes. You are using 'Helvetica Neue' inside style = '... 'Helvetica Neue' ...'. You should do it like this style = "... 'Helvetica Neue' ...".`

Also I see that you are already having double quotes around the anchor element so adding directly double quotes after style will be problamatic. You'll have to use escape character \" instead of " after style as Bhojendro has explained already.

Upvotes: 0

sujith karivelil
sujith karivelil

Reputation: 29036

It's simple, define the style in your .css file as class and assign class here in the back end. Example:

.css 

.custom-style-a {
 font-family:"Helvetica Neue Helvetica,Arial,sans-serif";
font-size:14px;
color:#fff;
text-decoration:none;
line-height:2em;
/*rest of styles here*/
....
}

And the appended html will be:

sb.Append("<a href='#' class=' custom-style-a' .....>");

Advantages :

simple to implement, can easily maintain styles later. No complex formatting is required, re use the styles if necessary.

Upvotes: 1

Ahs N
Ahs N

Reputation: 8386

Use double quotes but with escaped characters, like so:

sb.Append("<a href=\"#\" style=\"font-family:\"Helvetica Neue\",Helvetica,Arial,sans-serif;font-size:14px;color:#fff;text-decoration:none;line-height:2em;font-weight:bold;text-align:center;display:inline-block;border-radius:5px;text-transform:capitalize;background-color:#208ed5;margin:0;border-color:#208ed5;border-style:solid;border-width:10px 20px\" target=\"_blank\">");
sb.Append("link</a>");

Or you can always use the old way of concatenating:

string sb = "<a href=\"#\" style=\"font-family:\"Helvetica Neue\",Helvetica,Arial,sans-serif;font-size:14px;color:#fff;text-decoration:none;line-height:2em;font-weight:bold;text-align:center;display:inline-block;border-radius:5px;text-transform:capitalize;background-color:#208ed5;margin:0;border-color:#208ed5;border-style:solid;border-width:10px 20px\" target=\"_blank\">";
sb += "link</a>";

Upvotes: 1

Related Questions