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 to set background image to forms?

    Asked by mcota4421 on August 19, 2016 at 05:10 PM

    Need my form to look like this:

    uploads jpg background image CSS codes inject custom css form background page background
  • Profile Image
    JotForm Support

    Answered by Mike_G on August 19, 2016 at 07:01 PM

    To my understanding, you are working on with another form in your account which is, B Woods- Pre Season Clinic, and you would like it to have the same background as your other form, Verne Harris- Cerritos.

    To do that, you can add the following custom CSS codes below:

    .supernova {

        background-image: url("https://www.jotform.com/uploads/mcota4421/form_files/NBA_Basketball.jpg");

        height: 100%;

        background-attachment: scroll;

        background-position: center top;

        background-repeat: repeat;

    }

    .form-all {

        background-image: url("//www.jotform.com/images/backgrounds/white_tiles.png");

        background-attachment: scroll;

        background-position: center top;

        background-repeat: repeat;

    }

    The instructions on how you can inject custom CSS codes to your form is found in this guide: How-to-Inject-Custom-CSS-Codes

    Here's a clone version of your form where I have injected the custom CSS codes above: 

    https://www.jotformpro.com/form/62316762648967

    I hope this helps. If, in any case, I have misunderstood your concern, please feel free to contact us anytime and provide us more details about your concern. Thank you.

  • Profile Image

    Answered by mcota4421 on August 20, 2016 at 01:45 PM
    Just copy and paste this to Css section??
    Deep Dive Ref Admin Crew
    Info@deepdiveref.com
    www.deepdiveref.com
    "We WILL make you better"
    Sent from Mobile Outlook
    ...
  • Profile Image

    Answered by mcota4421 on August 20, 2016 at 01:45 PM
    The text in yellow??
    Deep Dive Ref Admin Crew
    Info@deepdiveref.com
    www.deepdiveref.com
    "We WILL make you better"
    Sent from Mobile Outlook
    ...
  • Profile Image
    JotForm Support

    Answered by Mike_G on August 20, 2016 at 02:13 PM

    Yes, that is correct.

    Here's how: 

  • Profile Image

    Answered by mcota4421 on August 21, 2016 at 04:46 PM
    Thank you so much! That worked. Now I selected the form to be
    "responsive" for mobile phones and tablets but it still looks funky on
    my iphone 6 plus. Is there another setting besides the check box?
    Administrative Staff
    Deep Dive Ref, LLC
    | info@deepdiveref.com | www.deepdiveref.com
    ...
  • Profile Image
    JotForm Support

    Answered by Mike_G on August 21, 2016 at 06:50 PM

    Can you try adding the codes below to your form and see if that fixes your issue?

    @media only screen 

    and (min-device-width : 414px) 

    and (max-device-width : 736px) {

    .form-header-group.hasImage>.header-logo {

        display: initial !important;

    }

    .form-submit-print {

        margin-left: 6px !important;

    }

    #id_13 .form-image{

    width:372.625px !important;

    }

    }

    Here's how it should look like on an iPhone 6 plus after you add the codes above: 

    I hope this helps. If you need any further assistance, please do not hesitate to get back to us. Thank you.

  • Profile Image

    Answered by mcota4421 on August 21, 2016 at 07:45 PM
    Add this to css below the other code?
    Administrative Staff
    Deep Dive Ref, LLC
    | info@deepdiveref.com | www.deepdiveref.com
    ...
  • Profile Image
    JotForm Support

    Answered by liyam on August 21, 2016 at 08:44 PM

    Hello mcota4421,

    Yes, feel free to add the code at the bottom of the earlier CSS insertions you've made. 

    Thanks.

  • Profile Image

    Answered by mcota4421 on August 21, 2016 at 09:45 PM
    Should I use these same codes for all my forms I want to be responsive and with background? 
    I'll save in a note to copy and paste. 
    Deep Dive Ref Admin Crew
    Info@deepdiveref.com
    www.deepdiveref.com
    "We WILL make you better"
    Sent from Mobile Outlook
    ...
  • Profile Image
    JotForm Support

    Answered by ashwin_d on August 21, 2016 at 11:07 PM

    Hello mcota4421,

    No this custom css code cannot be used in all forms and is specific for your form #62243761463152

    Do get back to us if you have issues with your other form and we will take a look.

    Thank you!

  • Profile Image

    Answered by mcota4421 on August 31, 2016 at 02:45 PM
    Hey guys can you help me with providing me with css code for responsive
    form for phones and tablets for form named "2016-17 RMAC Dues"
    You guys were a great help last time!
    Administrative Staff
    Deep Dive Ref, LLC
    | info@deepdiveref.com | www.deepdiveref.com

    ...
  • Profile Image
    JotForm Support

    Answered by Kiran on August 31, 2016 at 04:51 PM

    Your other question is moved to a separate thread and shall be addressed there shortly.

    https://www.jotform.com/answers/921597

    Thank you!