Roberto Flores Roberto Flores - 3 months ago 9
CSS Question

When button is hovered, how do I prevent the font color to change?

I am trying to prevent the button text to change color when the user hover overs the button.

I am using bootstrap but did not like the color so I just the same button but change the color.

However, unlike the bootstrap button, when i hover over the button, the text changes from white to black

The following is what I have:

<a class="btn btn-info1 slideText" href="/index.cfm/finder/" role="button" style="
">Find Now</a>


CSS styling:

.btn-info1 {
color: white;
background-color: #004377;
border-color: #004377;
background-image:-webkit-linear-gradient(top, #004377 0, #004377 100%);
background-image:-linear-gradient(to bottom, #004377 0, #004377 100%);
background-repeat:repeat-x;
border-color:#00437;
}


What can I do to stop doing that when it is hovered and active?

Thanks

Answer

You can set all 'variables' of your link. I use it on my projects.

.link, 
.link:hover, 
.link:active, 
.link:focus, 
.link:visited{
    /*Your code here, like:*/
    color: #FFF;
}

So the 'link' class will make all the magic. I hope it help you. :)