Adjusting space between form fields - with 3 columns

  • garymichael
    Asked on March 31, 2017 at 3:29 PM

    How do you reduce the space between fields with multiple columns?

  • Jan
    Replied on March 31, 2017 at 5:21 PM

    You can use custom CSS code to adjust the spaces between the columns. Please follow these steps:

    1. First, please remove this CSS code in your form.

    Adjusting space between form fields   with 3 columns Image 1 Screenshot 40

    2. After that, please insert this CSS code:

    .form-line {
       padding-left: 25px !important;
       padding-right: 0px !important;
    }

    #id_12 {
       padding-left: 100px !important;
    }

    Adjusting space between form fields   with 3 columns Image 2 Screenshot 51

    Here's a guide on How-to-Inject-Custom-CSS-Codes. Here's the result:

    Adjusting space between form fields   with 3 columns Image 3 Screenshot 62

    Hope that helps. Thank you.

     

  • garymichael
    Replied on March 31, 2017 at 5:45 PM
    How can I add vertical space between #header 21 and the other fields?
    Below the divider line. It's too close to each other.
    ...
  • garymichael
    Replied on March 31, 2017 at 6:45 PM
    Nevermind just tried the space widget :-) cool
    ...
  • Jan
    Replied on April 1, 2017 at 5:02 AM

    Glad to hear that your issue is now resolved. Please don't hesitate to open a new thread if you need any help. Thank you.