Product variations, “choose an option” is cut off

Hello,

How can I fix the product variation section so it does not cut off as seen here: https://snipboard.io/HKNfo6.jpg

It should say “choose an option”

Hello,

Please deactivate all the plugins except these ones:

Slider Revolution
WPBakery Page Builder or Elementor
Woodmart Core
Contact Form 7
MailChimp for WordPress
WooCommerce
Safe SVG

If the problem has gone, activate the plugins one by one, checking the issue to detect which one causes the problem.

In case, the problem remains, even after all the plugins are deactivated, provide your site admin access (insert the site credentials into the Private content block under the message area) and confirm the permission for plugins deactivation, switching to the parent theme. As soon as we complete the testing we will enable all back, however, the site would be without plugins for 15-20 min. You would better make the full backup of your site.

Best Regards

Hello, I have added the info in the private content.
I confirm the permission for plugins deactivation.

Hello,

Could you provide the page URL, the product I check does not have the problem you show: https://gyazo.com/eb3ff83287886e279afcdf0f5e802bb7

Best Regards

Hi there,

Please check the URLs in private content.

Hello,

I have deactivated Dokan Pro and Elementor Pro and PHP as well as child theme and it works: https://gyazo.com/4bf554e9ba61c6d7a0f8caf9129a3ff8

If you have any questions please feel free to contact us.

Best Regards

Hello,

I need Dokan pro and Elementor Pro and PHP. Without these my site will not work (it’s a multi vendor online marketplace) so I can’t have them deactivated.

Don’t you have a css code to fix this? It’s not happening on my current live site with another theme

Please advise.

Hello,

Let us solve all the issues and then you will activate them.

Best Regards

Please let me know when you solved this issue.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

.elementor-add-to-cart .elementor-element form.cart .variations {
    width: 100% !important;
    margin-bottom: 15px !important;
}

Best Regards

Hello that does not work. Please see video in private content.

Hello,

Please try this code:

body table.variations select {
    max-width: 100%!important;
}
body .elementor-element form.cart .variations {
    width: 100% !important;
    margin-bottom: 15px !important;
}

Best Regards

Thank you that worked!

You are welcome! We are here to help.

Wish you a wonderful day!

[Author]

Posts