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

    Is It Possible to Add a Rounded-Cornered Border to the Form?

    Asked by ssmediator on October 19, 2015 at 04:27 AM

    is it possible to add a rounded-cornered border to the form? Color = #53391D

    Like the image...

  • Profile Image
    JotForm Support

    Answered by mert on October 19, 2015 at 04:51 AM

    Hi,

    To add a border to your form, you need inject custom CSS code to your form. Below, you can find the necessary code to make border with color code #53391D.

    Red marked area represents the thickness level of border, you can adjust the px value from there and the blue marked area shows the color code. I added the color you want, but you can change its color.

     

    .form-all {

    border: 2px solid #53391D !important;

    }

     

    Also, you can find more information about CSS Border Properties from the following link:

    http://www.w3schools.com/css/css_border.asp

     

     

    After those changes, here is the final look of your form:

     

    I hope this method will help you.

    For further assistance, please don't hesitate to contact us.

     

    Thanks.

  • Profile Image

    Answered by Max  on October 19, 2015 at 11:28 AM
    Hi Mert. I think you forgot to include the CSS3 border-radius property for the rounded corners.
  • Profile Image
    JotForm Support

    Answered by mert on October 19, 2015 at 11:38 AM

    Hi Max,

    Thanks for the recall. Yes, to make the edges more rounded  "border-radius: 25px !important;" CSS code could be added. 

    And the final look of the code should be like the below:

     

    .form-all {

    border:5px solid #53391D !important;

    border-radius: 25px !important;

    }

  • Profile Image

    Answered by ssmediator on October 20, 2015 at 03:17 AM

    THANK YOU BOTH!

  • Profile Image
    JotForm Support

    Answered by mert on October 20, 2015 at 03:44 AM

    You are welcome. I'm glad to see that it is working for you.

    Please don't hesitate to contact us, if you need further help.

     

    Thanks.