The Other option in checkbox field needs to be aligned

  • Profile Image
    vtiportal
    Asked on January 21, 2018 at 10:21 PM

    I injected the code below but it's not aligned on my webpage. Please provide a solution. Thanks.

    #other_21 {
        display : none;
    }
    #input_21 {
        margin-left : -5px !important;
        width : 100% !important;
    }
    #cid_21 div.form-single-column {
        width : 100% !important;
    }

  • Profile Image
    Ardian_L
    Answered on January 22, 2018 at 06:42 AM

    Can you please use this CSS Code instead.

    #input_21 {

        margin-left: 7px !important;

        width: 80% !important;

        margin-top: -5px !important;

    }


    span.form-radio-item{

        padding-bottom: 9px !important;

    }

    Please check this link on how to inject CSS code on the form.

    Let us know if you have any other question. 

  • Profile Image
    vtiportal
    Answered on January 22, 2018 at 10:28 AM

    It's not working. It's still not aligned correctly.

    http://www.managemyopia.org/

  • Profile Image
    Ardian_L
    Answered on January 22, 2018 at 11:33 AM

    I am sorry I didn't mention this. When you make changes to your form this includes adding Custom CSS to your form.

    You have to generate the embedded code and put it on your website. You have to do this anytime you make changes to your form.

    Please let us know if you have any other question.

  • Profile Image
    vtiportal
    Answered on January 22, 2018 at 12:13 PM

    It's slightly better but it's still not perfect.

    1. Can the other form field be aligned on the left under the radio button?

    2. Or can it be aligned under the tect "Ophthalmologist (MD"?

  • Profile Image
    BJoanna
    Answered on January 22, 2018 at 01:32 PM

    There is an error in your CSS code (one of the comments is not set correctly).

    1516645713error.JPG

    Once you fix this error inside of the Advanced Designer your issue will be resolved. 

    1516645532mobile.gif

    I here is my cloned form: https://form.jotform.com/80214857846969 

    Feel free to test it and clone it

    Hope this helps to solve the issue.

  • Profile Image
    vtiportal
    Answered on January 22, 2018 at 04:51 PM

    OK thanks for the support. It's still not solving the issue. The alignment is not perfect.

  • Profile Image
    Welvin
    Answered on January 22, 2018 at 06:42 PM

    I've fixed it for you. Please check again.

  • Profile Image
    vtiportal
    Answered on January 23, 2018 at 03:04 PM

    Looks great! Can you tell me what you did so I can replicate it for other forms? Thank you.

  • Profile Image
    Welvin
    Answered on January 23, 2018 at 03:28 PM

    I have copy/pasted the following CSS codes to your form's Custom CSS area:

    #input_21 {

        margin-left: 7px !important;

        width: 80% !important;

        margin-top: -5px !important;

    }

    span.form-radio-item {

        padding-bottom: 9px !important;

    }

    It's my colleague's CSS. I think you just failed to save the changes. 

    Here's how to check the Custom CSS: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes.

  • Profile Image
    Welvin
    Answered on January 23, 2018 at 03:28 PM

    Note, the field ID (input_21) is not always the same. You should find it in the field properties. 

    https://www.jotform.com/help/146-How-to-find-Field-IDs-Names 

  • Profile Image
    vtiportal
    Answered on January 23, 2018 at 03:53 PM

     Thank you.