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

    How can I avoid an image being stretched on a mobile device

    Asked by fhpw on April 30, 2015 at 11:58 PM

    When viewing my form in portrait mode on my mobile device the image is stretched.  Is there a way to avoid the some images filling the media screen, while allow other images to respond?

    The image show is too large.  

     

    Thanks,

     

    Form Link: https://secure.jotformpro.com/form/51174046122949

     

     

     

    Page URL:
    https://secure.jotformpro.com/form/51174046122949

    Screenshot
    Mobile mobile device form link thanks
  • Profile Image

    Answered by Sammy on May 01, 2015 at 09:46 AM

    Hi,

    You can try limiting the width of the image you don't want expanded by applying specific widths to them.

    Goto Setup & embed -> designer

    Goto the CSS tab, click on the image wizard whose size you want to limit, when you click the element a CSS class will be added automatically, add a width property of 50% i.e width: 50% !important;

    Save and test the preview

     

  • Profile Image

    Answered by fhpw on May 01, 2015 at 02:15 PM

    Hi Sammy,

     

    It worked but changed the ratio.  Also, it changed the top banner, which I do want stretched. 

    I will just leave it as is.

     

    Thanks,

     

  • Profile Image
    JotForm Support

    Answered by Mike_G on May 01, 2015 at 04:06 PM

    In addition to what Sammy had suggested, you can also try to add this codes inside the #cid_18{}. 

    display: block; max-width:230px; max-height:95px; width: auto; height: auto;

    You may, of course, set the max-width and max-height to your own preference.

    Let us know if this doesn't help still or if you just want to stick with how it looks right now and leave it as it is just like you have said above.