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 Keep Image Size Same When Mobile Responsive is Enabled?

    Asked by radiocoders on December 25, 2015 at 10:20 AM

    Hello,

    how can I keep my images , example 170:50px.

    When I open my forms on any smart phone , mobile resposive widget expands all my images .

    I really want to keep this widget but I need my pics to stay same size.

     

    please see here (select model first)

    https://form.jotform.com/53575584012961

     

    Thanks a lot!!!

    mobile responsive keep image size
  • Profile Image
    JotForm Support

    Answered by mert on December 25, 2015 at 10:36 AM

    Hi there,

    By injecting some custom CSS, you can beat this issue. Below, you will find the necessary CSS code from the below:

     

    .form-image{

    width:170px !important;

    height:50px !important;

    }

     

    I hope this will meet your needs. Please, let us know the results.

    Thanks.

  • Profile Image

    Answered by radiocoders on December 25, 2015 at 10:55 AM

    Great , that worked. One more thing please, I need to exclude one image (MB alpine label) from that rule. Can I have CSS code for that?

    Thanks!

  • Profile Image

    Answered by radiocoders on December 25, 2015 at 01:26 PM

    Please tell me how to use custom css you gave me , but leave one image 15)MB Alpine label width 250px.

     

    Thank you again!

  • Profile Image
    JotForm Support

    Answered by Welvin on December 25, 2015 at 03:30 PM

    What image from the form? Let us know so we can check this for you. 

  • Profile Image

    Answered by radiocoders on December 25, 2015 at 03:34 PM
  • Profile Image
    JotForm Support

    Answered by Welvin on December 25, 2015 at 04:55 PM

    I think you are referring to the other form. This form http://www.jotformpro.com/form/53575584012961, correct? If yes, inject the following custom CSS codes:

    #cid_20 > img {

    width:250px !important;

    }

    Try it and let us know if this works or not.

  • Profile Image
    JotForm Support

    Answered by Charlie on December 26, 2015 at 01:33 AM

    Try replacing your custom CSS code with this one:

    #cid_3 > img {

        width : 170px !important;

    }

     

    #cid_4 > img {

        width : 170px !important;

    }

     

    #cid_5 > img {

        width : 170px !important;

    }

     

    #cid_7 > img {

        width : 170px !important;

    }

     

    #cid_8 > img {

        width : 170px !important;

    }

     

    #cid_11 > img {

        width : 170px !important;

    }

     

    #cid_20 > img {

        width : 250px !important;

    }

    Paste it under the CSS tab in your Form Designer Tool.

     

    Noticed that the last image is the one referring to "MB Alpine Label" with a width of 250px. The other CSS selectors refers to the other radio images in order. Here's a cloned form with those changes: https://form.jotform.com/53590670035959.

    Let us know if that works.