[Support request] Style issue with UABB WooCommerce QuickView

Home Forums Support [Support request] Style issue with UABB WooCommerce QuickView

Home Forums Support Style issue with UABB WooCommerce QuickView

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #2047841
    Kevin

    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.

    https://ibb.co/LgTgHw2
    https://ibb.co/NTYD5Ts

    #2048050
    Ying
    Staff
    Customer Support

    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.

    #2048065
    Kevin
    #2048091
    Ying
    Staff
    Customer Support

    I checked couple products, they look all good currently.

    Can you show me the page with the issue?

    #2048166
    Kevin

    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

    #2048207
    Elvin
    Staff
    Customer Support

    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.

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.