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

    Reduce vertical spacing between radio buttons and checkboxes

    Asked by abcls on August 28, 2015 at 05:43 PM

    I'm trying to make a form where the user can click off which seminars they want to attend. 2 sets of 2 seminars are running simultaneously, so i would like clicking off one of the options to disable the option of selecting of the seminar that runs concurrently with it. it doesn;t seem as thought im able to apply conditional field rules within one 'question',  so ive built the list out of an arrangement of check boxes and radio buttons, but i would like to reduce the vertical spacing between all of these fields so that they appear to the end user as one normal looking list.

    i've tried embedding the CSS for top and bottom padding but i dont have the skill for it, so i'm looking for some help.

    thanks very much! the form is located at: http://form.jotform.ca/form/52364610063245

     

    thank you!

    Page URL:
    http://form.jotform.ca/form/52364610063245

    vertical spacing reduce vertical
  • Profile Image
    JotForm Support

    Answered by EltonCris on August 28, 2015 at 07:42 PM

    Inject this CSS codes to your form.

    [data-type="control_radio"], [data-type="control_checkbox"] {

        padding-top: 0;

        padding-bottom: 0;

        margin-top: 8px;      

        margin-bottom: 8px;

    }

    Guide: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes-to-your-Form

    Result:

    Let us know if you want further changes.

    Regards!