2 replies [Last post]
Last seen: 17 years 35 weeks ago
Joined: 2004-05-25
Posts: 1
Points: 0

Hi all

Hopefully a simple one for somebody out there.

My page seems to be ignoring the a:active attributes.

Some simple html code to explain:

<a href="temp1.htm">link 1</a>
<a href="temp2.htm">link 2</a>

If the code was duplicated on temp1.htm and temp2.htm......

I link to an external css with the following decs:

a:link {
color: #FFFFFF;
text-decoration: none;

a:visited { color: #FFFFFF;
text-decoration: none;}

a:hover { text-decoration: none; color:#CC0000}

a:active { text-decoration: none; color:#CC0000}

BUT, when you click on a link I would expect it to be ACTIVE but no change in colour. It seems to be ignoring my css.

Am I making a big mistake here???

Thanks in advance for any help!

ClevaTreva's picture
A hilly place, UK
Last seen: 3 years 12 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Problems with a:active


I can't be sure, but I suspect the browser is showing your link in the visited color, as that is what it is.

Frankly, I don't think many people use active that much, I certainly don't.

Is this going to be used for a menu?

If so, and you want to make it look a bit prettier, why not look at this example:


See how the current page is a different color, BUT, when you use the menu by hovering the mouse, the active page goes back to normal color and only the menu item hovered over is highlighted. This is very difficult to do, and quite cool.


Sydney, Australia
Last seen: 18 years 10 weeks ago
Sydney, Australia
Timezone: GMT+10
Joined: 2003-11-15
Posts: 389
Points: 0

Problems with a:active

Some get 'active' confused thinking that if they click on the link and move to that page then the link should be active. That is not the case.

active is the same as focus and I actually use it as thus a:active:focus {....

It is used for tabbing purposes. If I use the tab button, as I tab over the links then they take on the a:active:focus { values. Its use is based on accessibility for people that can not use a mouse, but as that is probably very small, as clevtrev said, many do not put it in.

It is also the same result as you would want if hovering over the link with a mouse, and therefore could be done as below

a:hover, a:active:focus {text-decoration: none; etc


The only way to learn is to do it yourself