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 design this form. Help with CSS

    Asked by melodicsounds on May 03, 2017 at 09:53 PM

    Hi in my form: https://form.jotform.co/71228265851862 I need help with CSS to recreate the form and give a border so it looks like this:

    And also can you help me with the CSS or inject the right text so the "Limited Time Offer" and the rest of the text looks like this? When I add text to my form it looks with big spaces between it.

  • Profile Image

    Answered by RyanC on May 03, 2017 at 10:28 PM

    .supernova .form-all, .form-all {

        background-color : #ffffff;

        border : 5px solid #7BFC3E;

        

    }

     

    Just add this in the custom CSS.

  • Profile Image
    JotForm Support

    Answered by Chriistian on May 03, 2017 at 11:31 PM

    If you want to have a border around your form that has the exact color as what you are seeing on the image you have attached, please inject this custom CSS on your form:

    .supernova .form-all, .form-all {

        border : 5px solid #53C22A;

        border-radius : 10px;

    }

    Result:

    Here's the guide on How to Inject Custom CSS Codes.

    Let us know if you need further assistance.
    Regards.

  • Profile Image

    Answered by melodicsounds on May 04, 2017 at 12:58 PM

    Thanks it worked fine but when I embed my form to my website it has a white background still outside the border. See Picture.. how to take off this background outside border?

     

  • Profile Image
    JotForm Support

    Answered by John_Benson on May 04, 2017 at 01:54 PM

    Hello, can you please provide the website URL so we can check it further? 

    Try adding this custom CSS code:

    .supernova .form-all, .form-all { 

        background : transparent !important; 

    We'll wait for your response. Thank you.

  • Profile Image

    Answered by melodicsounds on May 04, 2017 at 03:25 PM

    It didn't worked! Remember I need white inside the border and just to eliminate the white outside the border.

  • Profile Image

    Answered by melodicsounds on May 04, 2017 at 03:28 PM

    Also can you help me add a shadow to the form please.

  • Profile Image
    JotForm Support

    Answered by John_Benson on May 04, 2017 at 03:29 PM

    Yes, we can help you. First, can you please share the website URL where you embedded the form so we can investigate it further?

    We'll wait for your response. Thank you.

  • Profile Image

    Answered by melodicsounds on May 04, 2017 at 05:45 PM

    https://www.conqrpreview.com/landing-standard

  • Profile Image
    JotForm Support

    Answered by John_Benson on May 04, 2017 at 06:10 PM

    Thank you for providing the website URL.

    Please remove the custom CSS code that I have given to you earlier: 

    .supernova .form-all, .form-all {
    background : transparent !important;

    And replace it with this custom CSS code: (How-to-Inject-Custom-CSS-Codes)

    .supernova { 

    background-color: transparent !important; 

    .supernova .form-all, .form-all { 

    background: #ffffff !important 

    Here's the result: 

    Please contact us again if you need assistance. Thank you.

     

  • Profile Image
    JotForm Support

    Answered by John_Benson on May 04, 2017 at 06:17 PM

    Here's the custom CSS code if you want to add a shadow to the form:

    .supernova .form-all, .form-all { 

        box-shadow: 2px 2px 2px #000000 !important; 

    Result:

    Hope that helps. Thank you.

  • Profile Image

    Answered by melodicsounds on May 04, 2017 at 06:48 PM

    Thank you buddy!