How can I reduce the spacing between fields

  • Profile Image
    Asked on February 08, 2018 at 11:06 PM

    I've used the Form designer to minimise the space between rows, but as you can see below, while the designer shows it the way I'd like it, when displayed the form reverts to much more space.

    I'd also like a little less space between the labels and the fields for the 'right justified' labels.


  • Profile Image
    Answered on February 09, 2018 at 05:47 AM

    Please Inject the following CSS code to your form:

    .form-label-top {
    margin-bottom: 0; padding-bottom: 0; } .form-label-right {
    padding-right: 0;

    How to Inject Custom CSS Codes

    I have cloned your form and you can see how it looks with the CSS code above injected:

    Let us know if you need further assistance.

  • Profile Image
    Answered on February 09, 2018 at 08:29 AM

    That doesn't seem to have altered the space displayed between fields. Your cloned form appears the same as my original one???


  • Profile Image
    Answered on February 09, 2018 at 10:05 AM

    Can you try the following codes instead?

    .form-line {

        margin-bottom: -10px !important;


    This should reduce the spacing between all the fields on your form. Feel free to further adjust the value in px if needed.

    This approach was discussed in great detail on METHOD 2 of the article below.

    Complete guide: How-Can-I-Change-Spacing-Between-Questions