- slider17Asked on October 21, 2014 at 06:21 AM
My form is currently set to display in two column format, this works fine on desktop devices but on mobile devices the content is all squished into a hybrid single column.
This only started happening after using the new form designer.
Any ideas how to fix this??
- BenAnswered on October 21, 2014 at 09:25 AM
I see what you mean.
Can you please tell us what changes did you make in the new Form Designer?
In regards to fixing this, I would suggest taking a look at this guide: How to View Form Revision History.
It will help you to restore any version of your jotform when your jotform was working properly.
- slider17Answered on October 21, 2014 at 10:33 AM
Really the only changes made were the column setting to 2
- CharlieAnswered on October 21, 2014 at 11:19 AM
I see that your columns are overlapping and does not correctly display on a mobile device, may I suggest you to use the widget Mobile Responsive. This will automatically display your form properly when viewed on a mobile device.
Let us know if this helps.
- slider17Answered on October 22, 2014 at 12:39 AM
yup that helps! :)
one visual problem that still exists is the issue of a 'gap' appearing on the form when viewed on desktop devices.
Please refer to screenshot below
u will see some empty space on the left hand column. Any idea how to fix this??
- BenAnswered on October 22, 2014 at 08:04 AM
I am glad to hear that the mobile responsive widget worked for you.
Now after going back to your jotform it seems to be displayed in both columns for me.
Do let me know if you have changed the layout or if you are still experiencing the same issue.
If you are still experiencing the issue, can you please tell us what is the browser that you are using?
- slider17Answered on October 22, 2014 at 08:15 AM
Its supposed to show up as two columns on desktop displays but single column on mobile devices.
Im using Google Chrome (latest version) on a Win 8.1 systemOn the topic of mobile, i've noticed my form displays just like the desktop version on a iPhone. On my Nexus4 its single column responsive, but on any Iphone device its two column layout. Any idea why that is??
- CharlieAnswered on October 22, 2014 at 10:14 AM
I'm not sure if this workaround is what you are looking for. But you may also try.
Add this code using Inject Custom CSS or from the Form Designer.
width : 350px;
margin-left : auto;
margin-right : auto;
Adjust the width with the value you wanted and it will adjust the sizes of the fields on the two columns. The problem is that the fields are widgets, it has a different width as a widget and as an input field.
With the iPhone size display, not sure what's the problem with it but we'll take a close look.
I hope this helps. Let us know if this works.
- slider17Answered on October 24, 2014 at 06:31 AM
tried the above, still getting big gaps in my form, both it step 1 and step 2.
- CharlieAnswered on October 24, 2014 at 08:34 AM
I think I misunderstood you. I thought we are talking about the columns gap but it was the gap between the date and address widget.
I tried making some workarounds but unfortunately nothing worked properly. I'll escalate this to our dev/technical team so that they can take a closer look. You will receive a notification when we have an update regarding this
I also made a separate thread about the iPhone display issue of the form so we can have a different focus on each thread. You can find it here: http://www.jotform.com/answers/448575