# Elementor Pro breaks Gravity forms styling

**URL:** <https://community.gravityforms.com/t/elementor-pro-breaks-gravity-forms-styling/8856>\
**Category:** Get Help\
**Tags:** elementor, conflict, css\
**Created:** [April 26, 2021, 6:19pm UTC](https://community.gravityforms.com/t/elementor-pro-breaks-gravity-forms-styling/8856 "2021-04-26T18:19:50Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![user5bf80c9db3ca47.6](https://sea2.discourse-cdn.com/flex020/user_avatar/community.gravityforms.com/user5bf80c9db3ca47.6/32/2822_2.png) [@user5bf80c9db3ca47.6](https://community.gravityforms.com/u/user5bf80c9db3ca47.6)\
**Post date:** [April 26, 2021, 6:19pm UTC](https://community.gravityforms.com/t/elementor-pro-breaks-gravity-forms-styling/8856/1 "2021-04-26T18:19:50Z")

</div>

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](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?

---

<div class="post-metadata">

**Author:** ![user5c0166073a6c48.6](https://sea2.discourse-cdn.com/flex020/user_avatar/community.gravityforms.com/user5c0166073a6c48.6/32/17391_2.png) [@user5c0166073a6c48.6](https://community.gravityforms.com/u/user5c0166073a6c48.6)\
**Post date:** [April 26, 2021, 11:24pm UTC](https://community.gravityforms.com/t/elementor-pro-breaks-gravity-forms-styling/8856/2 "2021-04-26T23:24:52Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![user5bf80c9db3ca47.6](https://sea2.discourse-cdn.com/flex020/user_avatar/community.gravityforms.com/user5bf80c9db3ca47.6/32/2822_2.png) [@user5bf80c9db3ca47.6](https://community.gravityforms.com/u/user5bf80c9db3ca47.6)\
**Post date:** [April 27, 2021, 1:52pm UTC](https://community.gravityforms.com/t/elementor-pro-breaks-gravity-forms-styling/8856/3 "2021-04-27T13:52:20Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![user5c0166073a6c48.6](https://sea2.discourse-cdn.com/flex020/user_avatar/community.gravityforms.com/user5c0166073a6c48.6/32/17391_2.png) [@user5c0166073a6c48.6](https://community.gravityforms.com/u/user5c0166073a6c48.6)\
**Post date:** [April 28, 2021, 2:10am UTC](https://community.gravityforms.com/t/elementor-pro-breaks-gravity-forms-styling/8856/4 "2021-04-28T02:10:23Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![richardw8k](https://sea2.discourse-cdn.com/flex020/user_avatar/community.gravityforms.com/richardw8k/32/2354_2.png) [@richardw8k](https://community.gravityforms.com/u/richardw8k)\
**Post date:** [January 5, 2022, 8:38am UTC](https://community.gravityforms.com/t/elementor-pro-breaks-gravity-forms-styling/8856/5 "2022-01-05T08:38:24Z")

</div>

Closed on January 5, 2022, 8:38am UTC


