Does the icon disappear when the button color changes?

NSFW Link Warning

I have a website:

link

On this page you will find add to cart button

orange

The button has an icon (a shopping cart)

... the track icon only appears if you delete the following code.

Please remove the below code and you will see the icon.

.button.button span{
background:red !important;}

      

How can I make these icons even if the button is orange?

Thank!

+3


source to share


1 answer


Use background-color

instead background

as the font icon is created using the background property.

Delete

.button.button span {
   background: red !important;
}

      



And add it here to this css property:

.product-view .add-to-cart button.button span span {
  line-height: 52px;
  font-size: 14px;
  text-transform: capitalize;
  padding: 0 20px 0 70px;
  background: url('../images/icon_cart_product.png') 17px 50% no-repeat;
  background-color: red !important;
}

      

+3


source







All Articles