Archived topic
Style issue with UABB WooCommerce QuickView
5 replies · Started by Kevin on December 13, 2021
Hi there,
I am noticing a styling issue with WooCommerce buttons in UABB's WooCommerce Quickview feature. The add to cart buttons overflow their container. Screenshots attached.
A plugin conflict test narrowed the problem to GP Premium. The symptom goes away when it's de-activated.
Can you help me understand why this is happening?
Please and thanks.
Hi Kevin,
GP Premium adds CSS to Woocommerce page, and UABB adds CSS to Woocommerce page too.
So the CSS would overrides each other depends on whose selector is more specific.
With all the CSS mixed up together, it's easy to cause styling issues.
If you can link us to the page, we can help have a look at it.
I checked couple products, they look all good currently.
Can you show me the page with the issue?
To see the symptom, follow these steps:
1. Go to https://lumberjackpellets.ca/2021-holiday-gift-guide/
2. Hover over any product
3. Click the 👁 icon
4. Notice how the WooCommerce buttons are styled
Thanks
Hi Kevin,
You can try adding this CSS to fix the button alignment for add to cart:
.uabb-lightbox-content .quantity.buttons-added > * {
display: inline-flex !important;
}As for the "Don't want to wait" and "Free shipping" below it, that's not in conflict with GP Premium's woocommerce styling as it is added by Beaver Builder.
