Dis-functional text decoration

[Webiter]

Controlling a link on the page as follows but do not want the link underlined.
text-decoration: none; will not do the job..! Why and is it possible to get rid of the underline in this situation?

Maybe if the link underline could be the same color as the text that would be easier on the eye.


.EngineLink { font-family: arial, univers, helvetica; font-size: 8px; color: #f48000; text-decoration: none;}


<SPAN CLASS="EngineLink"><b>Put Script Engine Link Here...!</b></span>

[jscheuer1]

.EngineLink a { font-family: arial, univers, helvetica; font-size: 8px; color: #f48000; text-decoration: none;}

Links are special in some ways. They have defaults that often override their containers, and depending on what values if any you may have defined for links in general on a page, those too may override styles from a given link's container. But if you (as I just did there) specify the a tag as a child of its container and style it instead, most of the time it will work. Sometimes though you have to be even more specific about it.

[Webiter]

Thanks John,

The result as attached image. There is nothing else on the page that has text underlined...! Does the image throw any additional light on it.

[jscheuer1]

Is it even an anchor link a tag? It doesn't matter if there are no other things on the page, it matters what the other styles for the page are. And it matters what the served markup is. You could try adding the !important keyword, with or without the a selector:


text-decoration: none !important;

From your image, it looks like using the a selector isn't even selecting the link. But you can try that part both ways

If you want more help, please post a link to the page on your site that contains the problematic code so we can check it out.

[Webiter]

Tried that and no luck. Maybe I am just being pickie but the dark line seems to stand out.

It is part of an old eCard script and I would like to provide a lightly colored link to the script authors website. The page has a .tpl extension so I will put it on the server as a html and give you a link that way. The page is the one that gets delivered as the receiving email. Link at this position (http://www.scriptest.webitry.net/blackline.html).

[jscheuer1]

It's the markup. The a tag comes before what you showed in your post. Use the original css:


.EngineLink { font-family: arial, univers, helvetica; font-size: 8px; color: #f48000; text-decoration: none;}

But change the markup from:


<TR><td><TD><center><A HREF="http://www.google.com"><SPAN CLASS="EngineLink"><b>Put Script Engine Link Here...!</b></span></A></center>

to:


<TR><td><TD><center><A CLASS="EngineLink" HREF="http://www.google.com"><SPAN><b>Put Script Engine Link Here...!</b></span></A></center>