CSS Catagories Hover?

[[email protected]]

I'm trying to create a hover color on the catagories list.

This is what I thought I could do, but I was wrong.
Could someone guide me with this? Not sure if I need to change something else to make it work in the style sheet.

Thank you.

/* categories box parent and child categories */
A.category-top, A.category-top:visited { color: red; font-size: 9pt; font-weight: bold; text-decoration: none }
A.category-top, A.category-top:hover { color: #00008b; font-size: 9pt; font-weight: bold; text-decoration: none }
A.category-subs, A.category-products, A.category-subs:visited, A.category-products:visited { color: #ff0000; font-weight: bold; text-decoration: none; }

[afo]

I'm not 100% sure, but I think you need to make the following changes (the ones in red).

/* categories box parent and child categories */
A.category-top a:visited, A.category-top a:visited{ color: red; font-size: 9pt; font-weight: bold; text-decoration: none }
A.category-top a:hover, A.category-top a:hover{ color: #00008b; font-size: 9pt; font-weight: bold; text-decoration: none }
A.category-subs a:visited, A.category-products a:visited,  A.category-subs a:visited, A.category-products a:visited { color: #ff0000; font-weight: bold; text-decoration: none; }

[[email protected]]

Thank you, that worked great!

[afo]

I got it right! I wasn't sure that was the answer, but looking at the other css, it seemed like the way it needed to be done.

Glad it got you going.

[[email protected]]

Once I change the code, the hover works but I lost my size of the text and bold.

Hmmm. not sure how that happened.

Would you know why I would loose that?

Also, I notice that my Code color changed. It was blue, now it is Red and Green.
I use Golive. I can change it in the source code view of the style sheet but it does not show up in the list. (CSS Definitions)

Any ideas?

Thanks again for you help!

[afo]

Try adding this replacing the color and font size/weight as necessary:

A.category-top a:link, A.category-top a:link{ color: red; font-size: 9pt; font-weight: bold; text-decoration: none }
A.category-subs a:link, A.category-products a:link,  A.category-subs a:link, A.category-products a:link { color: #ff0000; font-weight: bold; text-decoration: none; }

You can also split them up if you want/need to get the desired effect.

Also, on the definition that begins "A.category-subs", you have a font weight, but no font size.

[[email protected]]

OK.
I've lost my mind now.
the catagories weight is back, the size is back, but the hover doesnt work.
Also, the links under the catagories are wacked out. Hover has the large text and the regular link has the small nonbold text.

Here is a link: http://www.spittinimagesonline.com/storefront/

here is what I have nowin the CSS:

/* categories box parent and child categories */
A.category-top, a:visited, A.category-top:a:visited { color: red; font-size: 9pt; font-weight: bold; text-decoration: none   }

A.category-top, a:hover, A.category-top:a:hover { color: #00008b; font-size: 9pt; font-weight: bold; text-decoration: none   }

A.category-subs, a:visited, A.category-products, a:visited, A.category-subs:visited, a:visited, A.category-products:a:visited { color: #09f; font-weight: bold; text-decoration: none; }

[afo]

It looks ok to me. What am I missing? Hover goes from blue to red in the sideboxes and the products.

[[email protected]]

Yeah you are right.

It was my Browser, Safari.
Even clearing cache and refreshing.

Works in Firefox and Netscape.

Thanks for all your help!!

[afo]

Excellent! I'm glad you've got things the way you want them.