Auto scale the images on the form based on the screen resolution

  • Profile Image
    Asked on July 20, 2015 at 01:22 PM

    Also, on a different note.

    Is there a way to get images to auto scale to the resolution of the screen its being viewed on?  Again, using the above form, I have an image with the Local Authorities logo on it.  When viewing the form on a PC/Mac, it is fine but when viewing on a smartphone, the image is too large.

  • Profile Image
    Answered on July 20, 2015 at 01:44 PM

    Is this by going to the form submissions page and viewing the images there? Or, is it through email or the App for Android/IOS?

    I can forward this to our developers, but it needs to be specific. Our form submissions page is not optimized for mobile devices so I think you mean either through email or the app or something else through reports.


  • Profile Image
    Answered on July 21, 2015 at 05:04 AM

    Hi Welvin,

    This is when you have been sent the form and are filling it out (So I guess via email).

    e.g. a client needs to fill out the form so I send them this link:


    He uses his smartphone to complete the form.  However, the branding on the top and bottom do not scale to the size of his screen making the form look odd.  What I wanted to find out was whether there was a way to have these images recognise the screen resolution and scale appropriately.  The form itself does this very well, so I was surprised when I couldn't find any option for the images to do the same.


  • Profile Image
    Answered on July 21, 2015 at 10:25 AM

    Yes, you can do that and quite easy as well, by adding this CSS code to your jotform:

    img.form-image {
        height: auto;
        max-width: 100%;

    It will not change the image unless it is needed, so it will stay the same on your PC/Mac, while it will resize on iPhone and Android Phones - all devices that have smaller resolutions.

    You can add it to your jotform by following these steps: Inject Custom CSS Codes just remember to add the code after all other code in the custom CSS filed.

    Do let us know how it goes.