CSS: Adjust the spacing between multiple choice field options

Greetings,

How do you decrease the vertical spacing between multiple choice options within a question?

For example,

Choose from the list of your favorite foods:

(1) hamburger

(2) steak

(3) chicken

(4) fish

In a form, how could I lessen the vertical space between these four food options? (Also, see screenshot).

I would like to do this within my entire form.

Thank you.

Ken N

Hi Ken, 

Thanks for reaching out to Jotform support. You can easily adjust the spacing between your multiple choice field options by Injecting CSS Codes into your form. Let me walk you through it:

1. First, copy this code:

/*Adjusts the spacing between multiple choice field options - 27236251*/

.form-multiple-column .form-checkbox-item:not(.formCheckboxOther):not(:last-child), .form-multiple-column .form-radio-item:not(.formRadioOther):not(:last-child), .form-single-column .form-checkbox-item:not(.formCheckboxOther):not(:last-child), .form-single-column .form-radio-item:not(.formRadioOther):not(:last-child) {

    margin-bottom: 0px;

}

/*Code ends here*/

2. In Form Builder, click on the Paint Roller icon on the right side of the page to open Form Designer.

3. Now, in the Form Designer menu, click on the Styles tab, scroll down and paste the code into the Inject CSS Code box. That’s it. The code is automatically saved.

Give it a try and let us know how it goes.