- ashtutorsAsked on November 26, 2015 at 08:53 AM
I've got my sign up form set up on a blog post, and all is working correctly.
Except, on an iPhone, the 2 input boxes are showing out of place and it looks bad.
I've got the mobile responsive widget on the form, but it doesn't appear to be fixing the issue.
I'd appreciate some guidance.
- JotForm SupportWelvinAnswered on November 26, 2015 at 10:05 AM
Try adding the following custom CSS codes in the form. Please add it to the bottom:
display: block !important;
Here's how to add the codes: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes.
- ashtutorsAnswered on November 26, 2015 at 10:26 AM
Thanks Welvin - I've tried that but no joy.
The 2 input boxes are way over to the left, everything else is centred.
The CSS says that there are 4 errors - and that was BEFORE I added your code.
- JotForm SupportWelvinAnswered on November 26, 2015 at 10:56 AM
I've fixed the errors and added the custom CSS codes to your form. Can you check again?
The errors are like this (in the designer):
There is an extra semicolon in the area. That should be added after the !important declaration.
- ashtutorsAnswered on November 27, 2015 at 04:19 AM
Thanks for that Welvin. There are no errors showing up on the CSS now.
I've replaced the iframe code again on the site, and tried it again on my iPhone.
Still having the same issue though. the 2 input boxes in portrait orientation are misplaced off to the left.
Any other ideas would be gratefully appreciated.
(And I have to say, Jotform's support must be amongst the very best in the world! More people should know about it.)
- JotForm UI DevelopermertAnswered on November 27, 2015 at 05:02 AM
I checked your form and replicated the same issue. I assume that you set your form's width "100%" when you were getting the IFrame embed code. By doing this, your form's width is taking the width of the div.
To avoid that issue, please set the width close to the "300px". You can see the example of the modified IFrame embed code from the below. As it is seen, the width is changed.
I hope this one will work for you. Please let us know the results.
- ashtutorsAnswered on November 27, 2015 at 06:11 AM
No, I haven't changed anything. I got the form directly from one of the templates, and the errors, as well as this issue, have come along with it!
I've done as you've suggested and this has fixed the issue.
Once again, many thanks for a fantastic service!
- JotForm UI DevelopermertAnswered on November 27, 2015 at 07:21 AM
Geoff, you are most welcome and also thank you for your great words. I'm glad to see that it works for you.
For your other questions, support team is ready to help you as always.
Have a great day.