What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.
We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.
My jotform looks fine in the form builder but its fields are much too wide when viewed on the web page where it's embeddedAsked by lrobinson on December 04, 2014 at 02:59 PM
How do i get my response boxes to stay on the form page. Even the automatic ones like the phone number, or date and year, are way to big. I am sorry to have so many little questions. They look bigger on the actual form when it is embedded than they do on the screen when i am working on it. thanks again.
Firstly, it's our job to answer your questions, no matter how small or unimportant they may seem to you. And we like answering them too! :)
Anyway, the issue is being caused by the responsive nature of your jotform. I know you didn't set it to be responsive but once it has been edited in the Form Designer, it will likely become that way. (Our developers are working on fixing that glitch.) Whenever the form's width is below 768 pixels, the width of its fields will expand like you've seen and since the width of the jotform in your web page is less than 768px, the width of the fields are expanded. This block of CSS is causing that behavior and if it's removed from the form's injected CSS the problem will go away. However, due to the sheer volume of code which the Form Designer would have inserted, it may be difficult for you to spot and remove the aforementioned offending block. As such, I've saved the new code, sans the problematic section, to a page. Just delete all of the form's current injected CSS and replace it with this code. That should correct the problem but if it doesn't please let us know.
My apologies, I gave you the wrong link. Inject this code instead.
I am having the same problem as Irobinson - my date fields are spanning the width of my form. I see your solution above but it's still too advanced for me. Exactly where do I have to replace the code?
To use the styles you would need to inject them to your jotform. You can do that by following next steps: Inject Custom CSS Codes
Since the style is not intended for your jotform it might and it might not completely work because of the difference in the fields, but if that happens please open a new thread about it and we will be happy to help you sort it out as my colleague has done above.