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

    How can we change the style of the checkboxes and radio buttons to a desired one?

    Asked by jaes on October 21, 2013 at 12:20 PM

    Hi I have two questions:

    1) I want to format my checkboxes and radio buttons like this page:


    2) I want the form to be responsive and look good on the website or iPhone.



    What do I format first? Or do you recommend applying one of your templates?




    Page URL:

  • Profile Image

    Answered by paulalexanderbreen on October 21, 2013 at 12:32 PM

    Hi Jeremiah

    I'm new to JotForm myself (started over the weekend) but have found it really easy to use.

    I personally started from scratch with the two forms I've created (had a few teething problems but thats called learning)

    It's really easy to teach yourself, I've constructed hidden cells, used Jot form if statements that were so easy to use it was unbelievable. All in all, spend a little time to work your way around it and I'm sure you'll be supprised how flexible and easy it is to use.

    best of luck



  • Profile Image

    Answered by jaes on October 21, 2013 at 12:41 PM

    Hey there,

    EltonCris fixed my radio buttons once with some browser specific code in the following thread:


    But I don't know what code he used. Can you please help with my new form. I don't want radio buttons and checkboxes to always be a problem for me.

  • Profile Image

    Answered by jaes on October 21, 2013 at 12:55 PM

    Hey, I found it:

    .form-line-column {
    white-space: normal !important;
    .form-radio-item label, .form-checkbox-item label {
    display: block !important;
    margin-left: 19px;
    margin-top: -17px;
    }.form-radio-item label, .form-checkbox-item label,  x:-moz-any-link, x:default  {
    display: block !important;
    margin-left: 24px;
    margin-top: -17px;
    float:none !important;


    So now back to my original question: How do I apply the cool styles found here:


  • Profile Image

    Answered by EliezerN on October 21, 2013 at 02:08 PM

    Thanks for contacting us.

    It's  nice to know that you already found the correct code. Now, we would appreciate if you give us some time so that we can work in the style of the checkboxes, we are going to do the best to accomplish that style. However, we do not promise anything. But if we can find the correct code to give that style we'll notify you as soon as we can.

    We would also appreciate if you confirm us if this is the form you to want to apply the style to: http://www.jotform.com/32934354756664

    If not, please share the specific link so that we can proceed to work with it.


  • Profile Image

    Answered by jaes on October 21, 2013 at 02:13 PM

    Here is the form:


    I am still working out the conditions so it may look a little jumbled. I realize that the formatting is quite intensive so I know it will take some time. I am saving each version of the form because applying formatting can sometimes make the form go all silly.


  • Profile Image

    Answered by EliezerN on October 21, 2013 at 03:08 PM

    Thanks for the reply and the information provided. We'll start to work on the form trying to give a style from the page you suggest. 

    We'll get back to you later if we get something good.