Change the button hover


Anybody can help me with how to change the color of button and button hover?
Here is the link:

I want the button border color to be #ffa872 (it’s a coral color). So I wrote the code as below:


<a class=“btn view” href=“”>VIEW</a>

Custom CSS

.view {
  color: #ffa987;
  background-color: #fff;
  border-color: #ffa987;

.view:hover {
  color: #fff;
  background-color: #ffa987;

Can anybody tell me what’s wrong with that? Why doesn’t the color change? I attached the screenshot for a better explanation.

PS: I installed Bootstrap by the way, but when I copy the Bootstrap button code it automatically changes to the default button style which I don’t mind, I just want the color of the button change…


Add the button like this in the content,

<a class="btn view" href="">VIEW</a>

Then add this Custom CSS in Appearance -> Customize -> Additional CSS,

.btn.view {
    border-color: #ffa987;
    color: #ffa987
.btn.view:hover {
    background: #ffa872 none repeat scroll 0 0;
    color: #fff;

Let us know,


This is amazing, it worked!
I just add the border-color in the hover then everything works fine! thank you Laranz!