Elementor Pro breaks Gravity forms styling

I’ve isolated Elementor Pro as having a conflict that causes styling errors on any Gravity Form that is embedded in a page via a shortcode or via the Elementor Forms widget.

See the screenshots of these forms before and after Elementor Pro is enabled

https://drive.google.com/drive/folders/1rc040ZI6hcZelkmzrg_KyVCa0c7DlAsO?usp=sharing

I’ve tried downgrading to an earlier version of Elementor that doesn’t cause this problem, but so haven’t had any luck. Anyone else seeing this or know of a workaround?

Have you toggled the no conflict mode in the Gravity forms settings page? Not the form settings but the plugin settings page?

Click on forms, then the settings link that appears in the sidebar.

It may not fix it but it’s a good start and worth a shot.

Thanks Dere - I’ve tried your suggestion without any luck;(

You need to reach out to Elementor and ask them how to unenqueue their Gravity Forms styling. Perhaps they have an option? I’ve heard of elementor and I know it is a popular builder but have not used it myself. But considering how many people do use that plugin, I would imagine they have encountered this before. If that doesn’t work out you will need to write some CSS and add !important at the end of each css rule until you are happy with the design.

1 Like