Top Gravity Form Messing up Bottom Gravity Form

When I have two separate Gravity Forms on a page (one in the main content, another in the footer), the main content form seems to screw up the footer form. (You can't see the social media icons, for example.)

You can see this at:
http://184.172.186.25/~jonevan/stopain/share-your-story/
and
http://184.172.186.25/~jonevan/stopain/contact-us/

Look at the bottom right footer area (newsletter sign-up) on these two pages...then on any other page on the site. Compare them, and you will see that the form pages are messing up the bottom footer form.

It also seems that the culprit is the top form on these pages because when I remove the shortcode from the main content, the bottom footer form returns to normal.

Both main forms use conditional logic, but I deleted that function and the bottom form was still broken.

Can someone help me understand what is going on, and how can I fix it so that I can use both Gravity Forms on one page?

Thank you in advance.

Hi Kevin,

If you look at any other page on the site other than the two links I provided, you will see that the "footernewsletter" div area is contained fine and everything in the newsletter sign-up fits within the footer's assigned height. You see the social media icons and everything is hunky-dory.

It is only on those two pages that, when I add a second Gravity Form in the main content, that it somehow acts on the footer form. "Your form is vertically taller than 282px" is correct...but only on those two additional-form-in-the-main-area pages. The new form is making the footer form taller/expanded.

That is what I don't understand (why/how the added form is messing with the footer form) and what I can't seem to fix.

Thank you so much for your quick response and help with this...

Keith

Hi Kevin – sorry I didn't reply sooner; I didn't see that you'd responded.

Before I get going on what you said, I did not add the footer form as a "function call," based on my reading of your first link. It is just a shortcode added to a text widget...which I think is different than a function call, correct?

So I'm just double-checking: If a shortcode isn't a function call...and I added the form as a shortcode...do I still do the enqueue step in section 2.2?

Or do I need to delete the shortcode in the footer and use a function call instead...placing the php code within the widget using a PHP-plugin for the widget...and then do the enqueue?

Sorry for the back-and-forth, I'm just a little confused by the terminology. I've been using Gravity Forms for a year or two, and have never run into this before...

Keith

Hi Kevin,

I re-did the footer as a Gravity Forms widget, and while it still gets slightly affected (moves up a few pixels) when a second form is in the main section of a page, it's certainly acceptable and perhaps there's some small bit of CSS I'm missing that's the problem. So thank you for that.

Now I've just got an IE problem (surprise, surprise...)

I have switched servers on this project, so for reference now please see the footer form at: http://216.172.186.33/~stopain/

The Gravity Forms looks perfect in IE9...messed up unacceptably in IE8...and is just a disaster in IE7. Screenshots: http://imgur.com/ll9Va.jpg

Can you please take a look at this and help me understand why the form acts so differently? And do people still care about IE7, in your experience?

Thanks again,
Keith

Never mind. With no reply forthcoming, I went to a Constant Contact plugin solution, and that is working fine.