By heleng on

I have my links in the correct order on a style sheet ie. link, visited, hover, active. I have set the background colour of the active link. It flicks to that colour but does not stay when it is active. Why would this be?

⋅ Categories: Drupal 6.x

Comments

3cwebdev’s picture

3cwebdev commented

If you are using the :active pseudo class then this is your problem. a:active only applies the CSS while you are clicking, then returning the element to it's normal state.

You want to target the class .active and/or .active-trail

Depending on your theme, it may be something like:

 li.active a {color:#123456;}
heleng’s picture

heleng commented

This is what I currently have. How would I change this so it works?

ul.menu li a:active
{
color: white;
background-color:#000000;
}

3cwebdev’s picture

3cwebdev commented

Again, it may depend on your theme. But a good guess may be something like this:

ul.menu li .active a
{
color: white;
background-color:#000000;
}

If this doesn't work, please send a link to your site, if possible, and it will be real easy to help you out.

heleng’s picture

heleng commented

Hi,

It didn't work. Can you tell I am new to this : ( But I want to really learn how to do things. Its a development web site on a test server at the moment which is internal so you cant get at it. At some point in the next few days I will put it on an external server so that you will be able to see it if you wouldn't mind. I actually want the whole block to change background colour when its active, rather than just the link.

3cwebdev’s picture

3cwebdev commented

You can try

ul.menu li.active a
{
color: white;
background-color:#000000;
}

or

ul.menu li a.active
{
color: white;
background-color:#000000;
}

If neither of these work, then please post the html source from the part of the page that is generating the menu (make sure it shows the active class).