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

    Spread radio button columns

    Asked by safeinsight on June 17, 2017 at 09:07 PM

    I am trying to make the following radio button field spread out so that all of the buttons are on one line.  I have looked at multiple different forums and tried different CSS suggestions, but nothing seems to work right on this.  

    I have it set to spread over 8 columns for this particular field.

    Page URL:
    https://www.jotform.com/build/71676342684162

    Screenshot
  • Profile Image
    JotForm Support

    Answered by EltonCris on June 17, 2017 at 09:36 PM

    I presume this is now resolved? I see that they are now on 4 columns.

    Just to add, you have spread the column to 8 in your radio button settings, change it to 4. This should correct the problem without a need of CSS codes.

    Feel free to let us know should you need further help.

  • Profile Image

    Answered by safeinsight on June 17, 2017 at 09:38 PM

    No it is not resolved.  I want them in 8 columns, but I cannot get more than 4.

  • Profile Image

    Answered by safeinsight on June 17, 2017 at 09:42 PM

    I intended for there to be 8 columns, which is why I have it set to 8.  But with this setting, I still only get 4 columns.  That is why I'm looking for CSS codes to decrease spacing between the buttons.

  • Profile Image
    JotForm Support

    Answered by EltonCris on June 17, 2017 at 09:46 PM

    I am truly sorry. I have overlooked your point.

    I have now fixed your form for you.

    I injected the following CSS codes to it.

    #stage .form-all #id_3 .form-radio-item {

        min-width: 70px;

    }

    #id_3 .form-radio-item {

        width: 70px !important;

    }

    #id_3 .form-radio-item label {

        margin-left: 0;

    }

    Kindly check your form now.