Add Highlight to 'Proceed to Checkout' Button

Hi There,

Bit of a random one, but I've been asked by my boss if I can add a yellow highlight to the "Proceed to Checkout" button when someone hovers their mouse over it. I've used Firebug to find out the button is called 'btn button hikashop_cart_input_button' but I can't seem to find that in Display > Hikashop back-end CSS.

Am I looking in the right place and if not how would I go about giving the button some hover over colour?

Kind Regards,

Matthew

Hi Matthew,

You'll probably be able to do that by using some CSS code like :

.btn.button.hikashop_cart_input_button:hover {
border-color: yellow;
}

Hi Mohamed,

Thanks for the reply, but I'm afraid that CSS didn't work, instead of having a yellow border applied it just appears to shift the image of the button slightly!

Ok, then you should try something like this :

btn.button.hikashop_cart_input_button:hover[name="checkout"] {
border-color: yellow!important;
border-width: 10px !important;
}

That has worked great, thanks so much!