Need help removing this hover color

I tried using Firebug to find the reason for hover color (blue) of image links. Seems I am missing something.

If you go to this qtp training course page. You will find there are two images under the video - Download QTP training syllabus as PDF and Download QTP training FAQs as PDF. Now if you hover over any of these images, you can see a blue hover color. I want to remove this hover color.

Which property should I edit/remove?

Thanks for your answers.

 

Hi geekology,

On your styles.css

Try to edit this part:

.entry a:hover{padding:1px
0;color:#fff;background:#a90000;border-bottom:none}

then remove color:#fff;background:#a90000;

Let me know what happened.

Regards,
Katsa

 

Hey sunnykatsa - I tried that but didn't help. Anything else you would want to recommend?

 

can just paste that piece of code fro those two images and its css. It will be around that only.. else go from reverse. find that color code and search it...

 

Ok, this should work now.

On your styles.css remove:

background:#a90000;

from:

.entry a:hover{padding:1px
0;color:#fff;background:#a90000;border-bottom:none}


and on your custom.css file:

remove:

background: #1B37A9;

from:

.custom .entry a:hover { color: #fff; background: #1B37A9; }



Let me know.

 

If you have a custom.css file of the theme then find .custom a {} and add this below that:

.custom a:hover { background: none; }

But be advised that this will also remove background color on hover from all links on the content area.

If you specifically want to remove background color of only those two buttoned links while retaining styling on other regular text links, they you need to add a special class to those buttons and write override CSS accordingly.

Say if you are able to add a class "imgbtn" to those <a> tags which contain those image buttons then your style will be:

.custom a.imgbtn:hover { background: none; }

 

Yes sunnykatsa's method should work too. His post was not there while I was posting. Do what he says, it will work.

 

Yeah, that is also an option. However it's currently on wordpress so I only gave geekology the option of editing the css which will appear on the appearance section.

But assigning a different class with the image is really the best. It's just that a thought that the user may find it complicated editing the index file itself.

 

Yep mate agreed, adding custom class in WP isn't for everyone

 

Thanks a ton both of you. Since I just wanted to remove the hover from image, I have a created a class as advised by czent and it worked like a charm. + repped both of you

sunnykatsa - I am just inquisitive, how did you find these properties? I analyzed the link using Firebug but couldn't find the color background: #1B37A9; as pointed by you.

 

@czent - yeah

@geekology - First I did was checked if the hover issue was declared globally and found it not. Second is I looked at the container class since its only inside the div "entry" I managed to check all the properties underneath it. Since it was an image and link related thing, I checked the association of the "img" and "a" under their parent class.

Thanks for the rep though

 

@sunnykatsa - Cool. And for all this you used Firebug or any other tool from your arsenal?

 

nah, actually just used a notepad. i'm at the office right now and they don't use firebug. it's just that maybe i've been working in the web for like 8 years now so there's a repeating process from time to time.

 

I know your problem , some theme use JS to run css .You can check againt with your js file , i think you will find out it