I am having a problem with my form overflowing my footer, yet I need to get my site/form published very soon. I have spent much time on both the forms and the site. My theme provider is troubleshooting with me, there may be a theme/form conflict. If we can't get the form to appear correctly on my site, and I don't want to change themes, do you have any recommendations for how I could use my forms, but perhaps host elsewhere as the person is filling them out? Could I have someone click on the form from my main site, and then be taken to another location to fill it out (logistics/recommendations for this?) and then be taken back to my site? I'm just trying to think of the easiest/fastest way to use my forms, and not have to change my theme or site, which I am attached to. Thanks.
creative problem solving forms/theme conflict issue
-
Can you please post the URL to your form page again? I remember your issue and I'm sure we can come up with some kind of work-around that will work for the time being. Thx.
Posted 12 years ago on Friday June 17, 2011 | Permalink -
jessalouisa
MemberThanks, That would be awesome ... For some reason the site is running slowly for me now and the forms are taking forever to load (my theme provider said he was going to run the W3c validator?). Not sure if will be slow for you too. But on both of these pages, when the form is loaded, they overflow the footer.
exhaleinspirenow.com/reservations
exhaleinspirenow.com/simple-intake-form
(warning: internal links on site not all working/completed)I'd like to add a couple more forms once we can see if we can get these going ...
thanks so much
jessaPosted 12 years ago on Friday June 17, 2011 | Permalink -
Jessa,
Each page has a unique class on the body tag based on the page ID that's it's been assigned. I think we can use inheritance from that unique ID to force the height on the content div.
Try adding this to the end of your theme's stylesheet. It worked okay in my tests.
[css] html body.page-id-1957 div#left-area, html body.page-id-1977 div#left-area { height: auto!important; }If that works, then when you add new form pages, you'll want to add those page ID classes to this rule as well.
Let me know how it goes.
Posted 12 years ago on Friday June 17, 2011 | Permalink -
jessalouisa
MemberYou are a Miracle worker! Wow - it worked. thank you so much. From here forward, how do I find out the page ID number (four numbers?) for whatever page I have the form on ...
and then for example, I would simply add ...
html body.page-id-#### div#left-area,
above
{
height: auto!important;
}is this right???
thank you thank you x 1000Posted 12 years ago on Friday June 17, 2011 | Permalink -
Wonderful. I'm glad that worked.
So, to find the page ID, you need to view the page source (usually you can right click on the page somewhere and select "view source" or "view page source" or something like that depending on what browser you're using)
From there, you're going to want to find the body tag.. if you need, you can search for "body" to find it. As part of the body tag, you'll see a list of class names..
screenshot: http://grab.by/anzO
You're looking for the part that says "page-id-XXXX" where XXXX is actually a unique 4 digit page number. That's the class you add.
You will then add that to the style rule I gave you earlier.
[css] html body.page-id-1957 div#left-area, html body.page-id-1977 div#left-area, html body.page-id-XXXX div#left-area, html body.page-id-XXXX div#left-area { height: auto!important; }Remember to pay attention to the style syntax.. each page is separated by a comma and the last one just before the property is declared has no comma. That way the browser knows to apply that same rule to all of those different pages in the list.
Hope that helps. Let me know if you need anything else.
Posted 12 years ago on Friday June 17, 2011 | Permalink
