Title: Breaks button design
Last modified: September 12, 2024

---

# Breaks button design

 *  [sanderrrrr](https://wordpress.org/support/users/sanderrrrr/)
 * (@sanderrrrr)
 * [1 year, 8 months ago](https://wordpress.org/support/topic/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](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fbreaks-button-design%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

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

 *  Plugin Support [Alessio Torrisi](https://wordpress.org/support/users/alessio91/)
 * (@alessio91)
 * [1 year, 8 months ago](https://wordpress.org/support/topic/breaks-button-design/#post-18016911)
 * Hello there,
 * please add following CSS code in the site and let us know if the problem persists.
 *     ```wp-block-code
       .woocommerce-page div.product form.cart div.quantity {    float: left;    height: 53px;}
       ```
   
 *  Thread Starter [sanderrrrr](https://wordpress.org/support/users/sanderrrrr/)
 * (@sanderrrrr)
 * [1 year, 8 months ago](https://wordpress.org/support/topic/breaks-button-design/#post-18016964)
 * 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/](https://www.hardwarewalletonline.nl/product/ledger-nano-s-plus/)(
   with plugin) to [https://www.hardwarewalletonline.nl/product/trezor/](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?
 *  [Iván Sosa](https://wordpress.org/support/users/ivansosa/)
 * (@ivansosa)
 * [1 year, 8 months ago](https://wordpress.org/support/topic/breaks-button-design/#post-18021645)
 * Hi there,
 * please, add this CSS rule:
 *     ```wp-block-code
       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](https://wordpress.org/support/users/sanderrrrr/)
 * (@sanderrrrr)
 * [1 year, 8 months ago](https://wordpress.org/support/topic/breaks-button-design/#post-18022086)
 * 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)

The topic ‘Breaks button design’ is closed to new replies.

 * ![](https://ps.w.org/yith-woocommerce-product-add-ons/assets/icon-128x128.gif?
   rev=3142291)
 * [YITH WooCommerce Product Add-Ons](https://wordpress.org/plugins/yith-woocommerce-product-add-ons/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/yith-woocommerce-product-add-ons/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/yith-woocommerce-product-add-ons/)
 * [Active Topics](https://wordpress.org/support/plugin/yith-woocommerce-product-add-ons/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/yith-woocommerce-product-add-ons/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/yith-woocommerce-product-add-ons/reviews/)

 * 4 replies
 * 3 participants
 * Last reply from: [sanderrrrr](https://wordpress.org/support/users/sanderrrrr/)
 * Last activity: [1 year, 8 months ago](https://wordpress.org/support/topic/breaks-button-design/#post-18022086)
 * Status: not resolved