change colour of cart dropdown tab?

Hi Freexebrian,

Could you please post a link to your website. This will make it easier to work out the CSS.

Cheers!
-Maria Antonietta

I want to change the colour of the tab as you hover over it so the text is visible.
thanks in advance

Hi, Freexebrian,

If you’re using a child theme or a custom CSS editor (so your changes will be preserved on theme update), add this snippet to change the background color of the cart contents element:

.widget_shopping_cart .product_list_widget {
    background-color: red;
}

Replace ‘red’ with your favorite color and you’re good to go.

I hope this was useful ??

This only seems to change the colour of the top half of the tab not the whole thing. any ideas?

For the entire cart tab, you can try this:

.woocommerce-active .site-header .site-header-cart {
    background-color: red;
}

Still doesn’t change the colour around the total and button areas. Iv tried this for around total but doesn’t seem to do it

.site-header .widget_shopping_cart li, .site-header .widget_shopping_cart .buttons, .site-header .widget_shopping_cart .total {
background-color: blue;
}

Hi,

I’m not sure about this, it looks all blue to me. Have a look at this screenshot:

https://www.tiikoni.com/tis/view/?id=588958b

(this link will expire in a couple of days).

Perhaps I’ve misunderstood your request?

I mean when you hover over it and it drops down. i want to make that background blue

Hi Freezebrian,

It looks blue on my end (still a bit puzzled):

https://www.tiikoni.com/tis/view/?id=98e88a2

Is this the result you’ve been after?

it is only when you add a product that the buttons and total appear in the dropdown. its the background around these i mean.

i have just got this using james koster reply as i acciddently posted this twice.

.site-header-cart .widget_shopping_cart {
background-color: red;
}

thanks for your efforts

You’re welcome, I guess I couldn’t understand your requirement correctly. I’m glad it’s resolved!