Retain link color

HTML & CSS
1

Hi,

I have links on my site thats taken care by css

On this particular page I have ‘Text’ which is a link that take you to another page

What I want to do is for this link on this page not to change color, underline etc when you hover or click on it

I use the following css for this link:

.normalTxtBoldLink {
font-family: Verdana;
font-size: 13px;
font-style: bold;
font-weight: bold;
color: #686868;
text-decoration: none;
}

and this is the html code:

<p><span class=“normalTxtBoldLink”><a href=“index.php?option=com_jevents&view=month&task=month.calendar&Itemid=134”>Cadet Events Calendar</a></span></p>

I do not want to change the sites global css for other link behaviour, only for this link. I am doing something very silly I believe.

Eddie
:blush:

2

You need to have the class in the anchor tag as in <p><a class=“normalTxtBoldLink” href=“index.php?option=com_jevents&view=month&task=month.calendar& Itemid=134”>Cadet Events Calendar</a></p>

3

Thanks for the reply.

Tried it but it made no difference.

I will continue to try various options.

Eddie

4

See what making the CSS specific to the anchor tag does by using:

a.normalTxtBoldLink {
font-family: Verdana;
font-size: 13px;
font-style: bold;
font-weight: bold;
color: #686868;
text-decoration: none;
}

5

Assuming you have something else that says
a:hover {color:#123;}
you can override it by setting the declaration on
.normalTxtBoldLink, .normalTxtBoldLink:hover {…}
That means that the styles will apply to that class, including when you hover over it.

If that isn’t working, give us a link to a live page that’s showing the problem and we’ll see what we can do.

6

Thanks everyone.

With that information I got it working.

Eddie