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.


  • Profile Image

    Problem with Adobe Muse tablet layout

    Asked by tonycrowther on February 27, 2017 at 11:55 AM

    I am using the same RSVP/Contact Form on both a PC version and a tablet version of a website.  I have done this many times before. This time however it will not align properly on the tablet - it always aligns to the centre of the page, thus projecting way out to the right. At 520px wide it should fit easily. It should sit tight to the left have margin of the page and therefore fit within the page width. Attached screenshot shows the problem.

    Page URL:
    http://www.gemmacrowther.com/wedding/r.-s.-v.-p.html

    Screenshot
  • Profile Image
    JotForm Support

    Answered by Welvin on February 27, 2017 at 01:22 PM

    Please try re-embedding the form using our iframe embed method: https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code. There seems to be a conflict on the page that's causing the problem on iPad. The iframe will isolate the form from the page preventing the conflict. 

    This is the iPad page: http://gemmacrowther.com/wedding/tablet/r.-s.-v.-p.html

    Let us know if the issue persists.

  • Profile Image

    Answered by tonycrowther on February 27, 2017 at 02:24 PM

    Tried that - abosulutelt no difference.

  • Profile Image
    JotForm Support

    Answered by BDAVID on February 27, 2017 at 03:56 PM

    I am not understanding what the problem is, the picture you uploaded does not illustrate the problem.

    Please load the link of this thread in your browser: https://www.jotform.com/answers/1077024 

    Then take a screenshot of your iPad: https://support.apple.com/en-us/HT200289 

    You can even draw on the image to illustrate what is not fitting well, and where the form should be positioned: http://osxdaily.com/2017/02/13/markup-write-draw-photos-ios/ 

    Finally, upload it to this thread: https://www.jotform.com/answers/414264-How-to-include-screenshot-image-in-the-support-forum 

    Let us know if you need more help.

  • Profile Image

    Answered by tonycrowther on February 28, 2017 at 03:48 AM

    My original screenshot wasn't clear - the attached illusttrates the problem. The contact form aligns it's top left corner with the centre of the page, and hangs way out to the right, hence xooming the page out so it all goes small. I cannot get it to keep over to the far left and thus fit on the page.

    http://www.gemmacrowther.com/wedding/tablet/r.-s.-v.-p.html

     

  • Profile Image
    JotForm Support

    Answered by Charlie on February 28, 2017 at 06:00 AM

    I checked this on an emulator and was able to see the problem. Here's a screenshot of it:

     

    The problem is more related on the relation of your child and parent elements. The iframe has a width set to 100%, however, it sees the actual screen size rather than the parent element. 

    You could try setting the width of the iframe to "inherit" instead of 100%. 

    <iframe id="JotFormIFrame-70512987831967" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://form.jotform.com/70512987831967" frameborder="0" style="width: inherit; height: 1152px; border: none;" scrolling="no"> </iframe>

     

    I advised checking the responsive layout of the template or Adobe Muse. You can also check the following viewport configurations:

    https://developers.google.com/speed/docs/insights/ConfigureViewport 

    https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html 

     

    Creating different layouts for specific devices might be complicated, if that is the case it might not work on all types of devices. I am not entirely sure how it is done in Adobe Muse, but the viewport should already be enough to make it somewhat responsive. 

    I hope that helps.