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 copy the CSS style from a form to other one?

    Asked by BBC2016 on April 25, 2016 at 11:34 PM

    I am trying to make my member signup form look more like my event signup form. There are three sections of this form the product section#1 - the personal info section #2, and the billing section #3.

    Can u help me my member signup form make it look like the attached image I made?????

    The form fields in the 2nd section of personal info they are the same as the form fields on the EVENT SIGNUP page - can u copy and paste them? If not can u provide css?

    The billing section is EXACTLY the same as the EVENT SIGNUP page - can we copy and paste them somehow????? CAn u give me ccss code for it?? PLEASE????

    You guys have been lifesavers for me. I just recommended my boss to your website and he signed up today!!! I will continue to refer more of my contact - ur service and support is OUTSTANDING & GREAT!!!

    MEMBER SIGNUP FORM: http://buildingbridgescoalition.org/registration-form/

    EVENT SIGNUP FORM: http://buildingbridgescoalition.org/moreinforsvp

    Screenshot
    css code and OR sections product section attached
  • Profile Image
    JotForm Support

    Answered by liyam on April 26, 2016 at 06:19 AM

    Thank you for the trust and confidence, and signing up for a paid subscription with us, BBC2016.

    Regarding your concern, it will not be possible to copy-paste the fields from one form to another. But, it is possible to copy the whole form and just modify the newly copied form.  Here are the steps how:

    1. Go to the "My Forms" page

    2. Click the form you wish to copy

    3. Click the "More" button on the far right side

    4. Click "Clone Form"

    Finally, modify the details that you wish to edit with your form which should differ from the other one, and then just use this new form instead of the existing one.

    If this does not suit or fulfills your desire, please do let us know.

    Thanks.

  • Profile Image

    Answered by BBC2016 on April 26, 2016 at 03:37 PM

    I cant do it - can u help me??????

     

    I need the following and I cant figuere it out. I want it to look like the image I attached above:

     

     

    Can u help me my member signup form make it look like the attached image I made?????

    The form fields in the 2nd section of personal info they are the same as the form fields on the EVENT SIGNUP page - can u copy and paste them? If not can u provide css?

    The billing section is EXACTLY the same as the EVENT SIGNUP page - can we copy and paste them somehow????? CAn u give me ccss code for it?? PLEASE????

     

    Screenshot

  • Profile Image

    Answered by BBC2016 on April 26, 2016 at 04:08 PM

    I already told you I didnt know how to do this. I waited HOURS for you to write back and all you told me was what I already tried and couldnt DO!

     

    I already looked through the help sections. I could clone the form but I couldn't MODIFY and change the FIELDS - I want my form to look like this image I madebelow. I want this jotform (http://buildingbridgescoalition.org/registration-form/)  to look like this image.

     

    Screenshot

     

     

  • Profile Image
    JotForm Support

    Answered by Kevin_G on April 26, 2016 at 09:01 PM

    I have been working on a CSS code that may help  you to achieve the layout that you want in your form, you may take a look to my form before to apply this to your form, here is the link: https://form.jotform.com/61167302072951.

    If this is what you're looking for, then this CSS code is the used to achieve that: 

    .form-product-details {

        position: absolute;

        right: 0px;

    }

     

    .form-product-item{

        width: 100%;

        height: 39px;

    }

     

     

    li#id_13 {

        width: 100%;

    }

     

    .form-product-item span.form-sub-label-container {

        width: 11%;

        position: absolute;

        right: 0px;

        margin-top: -20px;

    }

     

    li#id_13 .form-address-table td[colspan="2"] .form-sub-label-container {

        width: 48%;

    }

     

    input.form-textbox.cc_ccv, select#input_13_cc_exp_year {

        width: 95% !important;

        margin-left: 43px;

    }

     

     

    label#sublabel_cc_ccv, label#sublabel_cc_exp_year {

        margin-left: 46px;

    }

    Follow the steps on this guide to inject the code to your form: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    Do get back to us if you need more help. 

  • Profile Image

    Answered by BBC2016 on April 26, 2016 at 11:12 PM

    thanks  for your help!!!!!!!!!!!!!!!!!!

    i marked in redtheparts i have still having trouble doing.

    the black lines, the form section titles in blue the total section

     

    plsletme know if u can help with helping me finish it with css code :)

     

    thanks a bunch - can i pay or upgrade to compensate u?

     

  • Profile Image
    JotForm Support

    Answered by EltonCris on April 27, 2016 at 03:32 AM

    Here's my cloned version with all the customization applied indicated in your screenshot.

    https://form.jotform.com/61171288007957

    Feel free to clone this form back so you can use it.