Title: Mini cart CSS help needed
Last modified: March 16, 2018

---

# Mini cart CSS help needed

 *  Resolved [gmsiegel](https://wordpress.org/support/users/gmsiegel/)
 * (@gmsiegel)
 * [8 years, 2 months ago](https://wordpress.org/support/topic/mini-cart-css-help-needed/)
 * In the Mini Cart section in the Header area, I’m trying to apply CSS style to
   the container which includes the cart details.
 * I’ve been able to apply CSS to what looks like the top half of the cart area,
   but the bottom half isn’t affected. I’m thinking this might be a menu style, 
   but I’m not sure. My goal is to make the cart background a certain color and 
   to use a border-radius, like the top half of the cart shows.
 * ps- you may need to add an item to the cart so that the mini cart will show contents.
 * Here’s the CSS I was able to use for the top half of the cart:
 *     ```
       div.widget.woocommerce.widget_shopping_cart {
       	background:red!important;
       	border-radius:12px!important;
       }
       ```
   
 * Here’s a screen shot of what it looks like
    [http://www.reddirtoutlet.com/public/cart-example.png](http://www.reddirtoutlet.com/public/cart-example.png)
 * Many thanks in advance.
    -  This topic was modified 8 years, 2 months ago by [gmsiegel](https://wordpress.org/support/users/gmsiegel/).
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fmini-cart-css-help-needed%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 3 replies - 1 through 3 (of 3 total)

 *  [Mikey Arce](https://wordpress.org/support/users/mikeyarce/)
 * (@mikeyarce)
 * [8 years, 2 months ago](https://wordpress.org/support/topic/mini-cart-css-help-needed/#post-10092381)
 * Hi
 * This is what I’m seeing right now:
    [http://a.mikey.link/TcPuVF](http://a.mikey.link/TcPuVF)
 * Something like this:
 *     ```
       .widget.woocommerce.widget_shopping_cart, .site-header-cart .widget_shopping_cart .buttons, .site-header-cart .widget_shopping_cart .total {
           background: red !important;
       }
       ```
   
 * Makes this:
    [http://a.mikey.link/wVBRFn](http://a.mikey.link/wVBRFn)
 *  Thread Starter [gmsiegel](https://wordpress.org/support/users/gmsiegel/)
 * (@gmsiegel)
 * [8 years, 2 months ago](https://wordpress.org/support/topic/mini-cart-css-help-needed/#post-10109649)
 * Mikey-
 * Thanks- that’s exactly what I was looking for!
 *  [Joel Williams](https://wordpress.org/support/users/joelwills/)
 * (@joelwills)
 * Automattic Happiness Engineer
 * [8 years, 2 months ago](https://wordpress.org/support/topic/mini-cart-css-help-needed/#post-10138947)
 * Great, I’m glad that helped.
 * All the best!

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Mini cart CSS help needed’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/storefront/4.6.2/screenshot.png)
 * Storefront
 * [Support Threads](https://wordpress.org/support/theme/storefront/)
 * [Active Topics](https://wordpress.org/support/theme/storefront/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/storefront/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/storefront/reviews/)

## Tags

 * [cart](https://wordpress.org/support/topic-tag/cart/)
 * [css](https://wordpress.org/support/topic-tag/css/)
 * [menu](https://wordpress.org/support/topic-tag/menu/)

 * 3 replies
 * 3 participants
 * Last reply from: [Joel Williams](https://wordpress.org/support/users/joelwills/)
 * Last activity: [8 years, 2 months ago](https://wordpress.org/support/topic/mini-cart-css-help-needed/#post-10138947)
 * Status: resolved