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

    Add a border to form

    Asked by tcrocker on July 30, 2017 at 05:11 PM

    Is there a way to add a border to a form? I don't want to change the page background. I just want a simple border around the form.

    Page URL:
    http://www.iwc-ltd.co.uk/executors-duties__find-a-will.html

  • Profile Image
    JotForm Support

    Answered by Jan on July 30, 2017 at 05:52 PM

    I checked your web page and I can see that you already added a border to your form. However, the border is not showing if you decrease the width of the container. Please try the following steps:

    1. Insert the Mobile Responsive widget to your form. Here's a guide on How-to-Add-a-Widget-to-your-Form.

    2. Please inject this custom CSS code:

    @media screen and (max-width: 689px) {
    .jotform-form .form-all {
       width: 98% !important;
    }

    @media screen and (max-width: 767px) and (min-width: 480px) {
    .jotform-form .form-all {
       width: 98%; !important;
    }

    Here's a guide on How-to-Inject-Custom-CSS-Codes

    Here's the result:

    3. If the issue persists, please try to re-embed the form using the iFrame method. Here's a guide: https://www.jotform.com/help/148-Getting-the-form-iFrame-code.

     

     

    Hope that helps. Thank you.

  • Profile Image

    Answered by tcrocker on July 30, 2017 at 06:44 PM

    Many thanks for the prompt reply. Ive managed to get it working. Can you let me know how I can make it so that each input box is not pushed right up to the edge of the border. Thanks. 

  • Profile Image
    JotForm Support

    Answered by jonathan on July 30, 2017 at 07:30 PM

    You can fix that in the Advanced Designer>>> Form Layout

     

    set a number in the vertical and horizontal padding layout.

    Here is a comparison result.