Docs

[bperry420]

I am trying to make 2 unique buttons at the bottom of my homepage (above the footer)
petpace.com

Here is the code for my buttons:

[button class=”my-contact-btn” href=”/contact” title=”CONTACT A PETPACE EXPERT”]CONTACT A PETPACE EXPERT[/button]

[button class=”my-shop-btn” href=”https://store.petpace.com/” title=”SHOP PET PACE”]SHOP PET PACE[/button]

Here is my CSS code:

.x-btn.my-contact-btn
{
color: #000000;
border-color: #000000;
background-color: #ffffff!important;
}

.x-btn.my-contact-btn:hover
{
color: #ffffff;
border-color: #000000;
background-color: #000000!important;
}

.x-btn.my-shop-btn
{
color: #ffffff;
border-color: #f8951d;
background-color: #f8951d!important;
}

.x-btn.my-shop-btn:hover
{
color: #ffffff;
border-color: #000000;
background-color: #000000!important;
}

I can not get this to work.
I followed your tutorial from here: https://community.theme.co/kb/implementing-additional-button-colors/

[Jade]

Hi there,

The code you added doesn’t seem to work because it falls under the media query block that is added above it. Kindly close the media query so that the code will function.

[bperry420]

Thank you so much! My bad 🙂

[Joao]

You are welcome.

Let us know if we can help you with anything else.

Joao

[Author]

Posts