Classic Accordion sections automatically stay open after update

[joshvce]

Hi, I was completing routine updates, validating the purchase code for marriagedynamics.com so I could update Cornerstone. On the About page, there are 4 sections that use the “Classic Accordion” cornerstone block, but they are not functioning properly. They stay open rather than shrinking when you click the “x.” Can you help? https://marriagedynamics.com/about/

[mldarshana]

Hi There @joshvce

Thanks for writing in! I think I have seen another similar thread of yours, with regard to an incompatibility issue. In this site also, you have updated your Cornerstone plugin to the latest version, but you’re still using an older version of X theme which creates an incompatibility issue.

You can see the latest version information from here (https://theme.co/apex/forum/t/troubleshooting-version-compatibility/195) and update your X theme and any outdated plugins accordingly (https://theme.co/apex/forum/t/setup-updating-your-themes-and-plugins/62).

After updating, make sure to clear all cache and test your issue again. You can follow this resource if required (https://www.wpbeginner.com/beginners-guide/how-to-clear-your-cache-in-wordpress/).

Let us know how it goes.
Thanks!

[joshvce]

Thanks! I updated X and the accordion issue was fixed. However, I noticed some styling changes after update (similar to my other post about the Vita site). Seems my form styling is affected. Any advice? If I need to I can go in and manually try to fix the css that seems to be affected, but I’d rather avoid the time spend if there is an easier solution. Thank you!

[nabeel]

Hi again,

This could be just a cache issue, after doing the updates, always remember to clear all caches (if you are using WP Rocket, WP SuperCache, W3 Total Cache or Server Cache) when updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

Let us know how this goes!

[joshvce]

Purged all the caches, but no luck Same issue still occurring.

[Prasant]

Hello @joshvce,

Thanks for updating the thread.

Can you please share login details in secure note for us to take a closer look as I don’t see the relevant CSS codes getting applied.

Thanks.

[joshvce]

Sure, let me know if this works:

[friech]

Hi @joshvce,

This is actually an issue with Gravity Form plugin, regretfully we do not provide support for 3rd party plugins.

But I’ll let you know what is the issue. This is the issue:

Notice the cross-out CSS code on the left-side particularly these two properties width: 100%; and padding: 15px 30px;

You can locate this block of code under Appearance > Customize > Additional CSS

Those are the CSS properties that give width to your Gravity form button and alignment in it respectively. However, its been cross-outed meaning it was overwritten by another CSS rule that has higher propriety.

To resolve that, you can add !important statement on those properties.

e.g.

width: 100% !important;
padding: 15px 30px !important;

Everything You Need to Know About !important CSS Declarations

Hope it helps,
Cheers!

[joshvce]

Thanks for your help! I was able to manually adjust some CSS to fix the forms.

[friech]

Glad you sorted things out,

Cheers!