rory-h rory-h - 4 months ago 5
CSS Question

css hover on a link - not working

This is the site - http://54.169.61.153/responsibility/coffeehouse/merchandise/mobile-apps/starbucks-mobile-applications

The last section has a button - Join Now.

At the moment the button on hover has - green background and white text. I wanted it to be white background and green text.

I tried this code :

.joen_now_part h6 a:hover {
background-color: #fff;
color: #2a8a15;

}


But for some reasons nothing changes.

Help and suggestions will be greatly appreciated.

Answer

there is already some class applied so have to overwrite the class

this is the default class its applying

a:hover, a:focus, a:active {
    background-color: #2a8a15;
    color: #fff;
}

so u have to add this

 .joen_now_part h6 a:hover {
   background-color: #fff !important;
   color: #2a8a15 !important;

 }

for reference https://plnkr.co/edit/qpoPOV5MYruWk9h6QfRT?p=preview

Comments