1. Home
  2. Knowledge Base
  3. WooCommerce Product Add-Ons Ultimate
  4. Layout issue with Elementor
  1. Home
  2. Knowledge Base
  3. Troubleshooting
  4. Layout issue with Elementor

Layout issue with Elementor

If you’re using the Elementor page builder with Product Add-Ons Ultimate, you might find the layout on the product page goes awry, most probably with the Add-Ons and the Add to Cart button appearing next to each other in two columns.

This is because Elementor applies a flex layout to the cart form. You can fix this by adding this CSS to your Additional CSS field in the Customizer:

.woocommerce div.product.elementor form.cart.variations_form .woocommerce-variation-add-to-cart,
.woocommerce div.product.elementor form.cart:not(.grouped_form):not(.variations_form) {
display: block;
}
.elementor-element ul.pewc-product-extra-groups {
padding: 0;
}

Was this article helpful?

Need More Support?

If you can't find the answer that you're looking for, then please use the link below to raise a support ticket.
Contact Support

Related Articles