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

    My website is able to change to any size screen and I would like to know if the form can do the same?

    Asked by monumentvalleysafari on March 04, 2014 at 11:38 PM

    Hello, I have a cascading stylist sheet and I wanted the form to shrink down to my iphone size like the rest of my website. Is there an option or way I can do this. I have tried messing with the form but haven't been able to do so. If you could help me with this that would be great!

    size same and shrink hello
  • Profile Image
    JotForm Support

    Answered by EltonCris on March 05, 2014 at 01:20 AM

    Hi,

    Inject the following CSS codes to your form so the form adjusts its width on small browser window.

    /*-----------RESPONSIVE LAYOUT-----------*/

    @media (max-width: 480px) {

    .form-line.form-line-column {

    width: 100% !important;

    }

    .form-textarea,

    .form-textbox,

    .form-dropdown{

    width: 100% !important;

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

    }

    .form-label-left, .form-label-right{

    width: auto !important;

    }

    .form-buttons-wrapper{

    margin-left:0 !important;

    }

    .form-input {

    width: 100% !important;

    }

    .form-all{

    width: 100% !important;

    }

    .form-sub-label-container {

    width: 100% !important;

    display: block  !important;

    }

    .form-spinner input {

    height: 20px !important;

    }

    }

    Guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    Possible output:

    Hope this helps!

  • Profile Image

    Answered by monumentvalleysafari on March 05, 2014 at 09:20 AM
    Thank you very much, It works like a charm!
    You were very quick and helpful. I used to you emailmeform, but i have switched over. Your product is much better.
    Kind Regards,
    Skye
    ...
  • Profile Image

    Answered by EliezerN on March 05, 2014 at 09:28 AM

    @Skye

    It is good to know that my colleague's suggestion worked. So, on behalf of my colleague you are very welcome.

    Feel free to contact us again in case you need further help. If it is an unrelated inquiry, kindly open a new thread.

    Thanks