JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.
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.
Mobile Form button and font size isn't quite appearing correctlyAsked by ekdesigns on October 15, 2016 at 04:17 PM
I've made my mobile site's page with a smaller form taken from my main website one, and for some reason the submit button (which I've experimented with) doesn't look right.. at least on the form builder view it looks fine but when published online, the vertical position inside the button itself isn't central.
I must be missing something or should remove something but I haven't a clue what as I'm not an expert at coding.
mobile form size font size Mobile
Have you tried making your form mobile responsive?
If not, here is the guide : https://www.jotform.com/help/322-How-to-make-mobile-friendly-forms-on-JotForm
I hope this solves your problem.
Thanks, I managed to solve the problem with that link!
Glad to hear that the issue is now resolved. Let us know if you need further assistance. Thank you.
Just one thing, my iphone screen is correct now but when I check my kindle fire, it still has the same problem.. I increased the media screen width to 900px which should enable the kindle fire to work properly .. but not so much. Am I missing something here?
I would like to apologize for I don't have a Kindle Fire device, but can you provide us more information, please?
May we know what Kindle Fire device you have? And can you post a screenshot in this thread of your form loaded on your Kindle Fire device, please?
We will wait for your response. Thank you.
Ahh yes, sorry about that! I've attached a picture of what I'm seeing on my kindle fire HD (3rd generation) device:
May I know what the issue is? It seems to be working properly on your Kindle device. Are you referring to the vertical alignment of the text in the submit button?
I checked your website link and it seems to be a specific design for mobile device: http://www.ekdesigns.co.uk/Upload/m-signup. I'm not sure how mobile responsive your actual website. For now, could you please try the following:
1. First, please do check your CSS code in your Form Designer Tool, there seems to be an error on it specific to this section:
2. May we also know, if you scroll down on your Kindle device, can you see the whole submit button with the correct alignment? You might not be seeing the whole submit button because there's a white border at the bottom that seem to cut off part of the form itself.
I hope that helps.
Thanks for your quick reply. Basically yes the issue is that the text on the button itself isn't aligned centrally on the kindle fire unlike on my iphone. I managed to remove the issue you pointed to above, but it's still the same otherwise. And yes, when scrolled it's still as shown. I don't believe it's cut off by anything.
Are you referring to the issue where the text "Send" inside the submit button is not vertically align in the center?
If yes, then the problem is with the height of the Iframe. It is set to 228px which is why it is cut-off. Please increase the Iframe height to 245px.
<iframe id="JotFormIFrame-62885184315361" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotformeu.com/62885184315361" frameborder="0" style="width: 100%; height: 245px; border: none;" scrolling="no"> </iframe>
Hope that helps. Thank you.
The thing is, on jotforms embed via iFrame area, it says the height is 539px.. although I can see that in reality the actual area of the form is only 225px or so, so I lengthened the html fragment that I placed the iframe code in, but it still hasn't changed.
Anything I missing?
The iFrame comes with an auto height script by default. Please remove the script that is following the iFrame code, and then use the code provided by Jan.
Ahh brilliant, works perfectly, thank you so much!