SOLVED: Off canvas mini cart: Title text goes over remove from cart icon

Browser: Chrome 112
OS: Windows
URL: Screenshot

Off canvas mini cart: Title text goes over remove from cart icon

image

{"content":[{"id":"vxhijj","name":"woocommerce-mini-cart","parent":"dtzasy","children":[],"settings":{"icon":{"library":"svg","svg":{"id":4413,"filename":"cart-icon.svg","url":"https://laperle.nomon.fi/wp-content/uploads/2023/05/cart-icon.svg"}},"cartDetailsOffCanvas":"right","openMiniCartOnAddedToCart":true,"buttonBackgroundColor":{"hex":"#000000"},"buttonTypography":{"color":{"hex":"#ffffff"}},"cartDetailsTypographyQuantity":{"color":{"hex":"#000000"}},"cartDetailsTypography":{"font-weight":"500"}},"themeStyles":[]}],"source":"bricksCopiedElements","sourceUrl":"https://laperle.nomon.fi","version":"1.8-beta","globalClasses":[],"globalElements":[]}

Hi,
Thanks so much for your report!

Can you provide me with a live link where I can see the issue? In my tests, the text wraps :thinking:
Alternatively, you can give this a try:

.brxe-woocommerce-mini-cart .cart-detail li a:not(.remove.remove_from_cart_button) {
    max-width: 85%;
    display: inline-block;
}

Best regards,
timmse

Yes, I did that css fix earlier. I will send you link in pm

I found out that bug occurs if the product is variable product.

image

Ah, I see. The easiest fix is to apply a padding-right to the <li>:

.brxe-woocommerce-mini-cart .cart-detail li {
  padding-right: 20px;
}

I will suggest that as a minor improvement :slight_smile:

Hi,

We’ve fixed this issue in Bricks 1.8 beta 2, now available as a manual download in your account.

Please let us know if you are still experiencing issues.

As with any beta release, please do not use it on any production/live website. It is only meant for testing in a local/staging environment.

1 Like