Centering checkboxes and form collapse

  • Profile Image
    Swilliams987
    Asked on September 16, 2012 at 11:40 PM

    Hello,

    I managed to center the headings, but am still having difficulty centering the text in the form collapses and the checkboxes. Can you please provide me with a solution?

    Thanks!

  • Profile Image
    Rodjit
    Answered on September 17, 2012 at 12:09 AM

    Hi Swilliams987,

    For the form collapse tool, you'll need this codes and inject them to your form:

    .form-collapse-mid {

    text-align: center !important;

    width: 100%;

    }

    For the checkboxes, you have to get it's ID by right clicking the field in the form builder and then apply the CSS codes. Example for the terms and agreement checkbox field.

    #id_20 {

    text-align: center !important;

    width: 100%;

    }

    Hope this helps you.

     

    Rodjit

  • Profile Image
    Swilliams987
    Answered on September 17, 2012 at 12:11 PM

    Thanks! The form collapse worked. For the checkboxes, technically it worked because the checkboxes were moved the the center but I guess I needed the checkboxes, the text, and the images on each line centered.

    And, how would this work for radio buttons too?

    Thanks again!

  • Profile Image
    pinoytech
    Answered on September 17, 2012 at 12:25 PM

    Use this codes to inject and inject into your form:

    #id_20, #id_110, #id_137 {

    text-align: center !important;

    }

    .form-captcha {

    margin: auto;

    }

    If you need further assistance, feel free to contact us at anytime.

    Have a good day!

  • Profile Image
    Swilliams987
    Answered on September 17, 2012 at 05:54 PM

    Unfortunately, not only was I not able to get it to work, more problems were created. My images were lost and the formatting is way off- now I'm having to make fields smaller to fit for some reason- and some of my labels are smaller than others.

  • Profile Image
    jonathan
    Answered on September 17, 2012 at 08:53 PM

    @Swilliams987

    Is this how you wanted it..

    I tested it on this cloned form of yours http://www.jotform.me/form/22607564445456

    This are the CSS code I used

     

    #id_110 {text-align: center !important;width: 100%;}

    #id_133 {text-align: center !important;width: 100%;}

    #id_137 {text-align: center !important;width: 100%;}

    .form-captcha {margin:auto}

     

    Please inform us if you have further inquiry.

    Thanks.