Breaks button design

  • Hello,

    thank you for offering this plugin. I run into problems with the layout of the add-to-card button design. I am using the Salient Theme.

    The layout shold be the quantity buttons on the left, with the add to cart button to the right of that in full width. This is still the case with other products. However, when using this plugin it breaks this layout and i am not sure what is causing this. Do you see the reason? Perhaps it is an unclosed definition of a position?

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support Alessio Torrisi

    (@alessio91)

    Hello there,

    please add following CSS code in the site and let us know if the problem persists.

    .woocommerce-page div.product form.cart div.quantity {
        float: left;
        height: 53px;
    }
    Thread Starter sanderrrrr

    (@sanderrrrr)

    Thank you. That partially fixed it, allthough I would probably prefer a solution within Yith and not actually start overwriting core CSS.

    The suggestion currently aligns the buttons but still does not show the button full width. Compare https://www.hardwarewalletonline.nl/product/ledger-nano-s-plus/ (with plugin) to https://www.hardwarewalletonline.nl/product/trezor/ (without plugin active).

    Is there something within Yith that does not close properly or affects the rest of the page?

    Plugin Support Iván Sosa

    (@ivansosa)

    Hi there,

    please, add this CSS rule:

    form.cart:has(#yith-wapo-container .yith-wapo-block) {
        display: flex !important;
    }
    form.cart:has(#yith-wapo-container .yith-wapo-block) #yith-wapo-container {
        flex: 0 0 100%;
    }

    Let me know if that did the trick!

    Thread Starter sanderrrrr

    (@sanderrrrr)

    Hello, thank you for this code. This indeed seems to solve the issue, but only in Chrome. The use of :has is not very common yet and not supported by many browsers.

    Could you perhaps explain what is causing the misalignment? Perhaps we can find a more elegant solution, or make sure it does not break in the first place. Is this something that could be solved within the Yith plugin, or will there always be a conflict here?

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