How to apply same style of radio button to other textbox?

  • Profile Image
    samspar
    Asked on August 25, 2015 at 10:12 AM

    Hello, 

    When I include "Other" options in my form, the formatting/style does not match the rest of the standard options. I tried using the workaround here: http://www.jotform.com/answers/50683-Formatting-the-other-button-in-radio-button- and it seems to work in the form designer, but when I actually look at the form itself it shows up as the code in plain text and not as an "Other" textbox where you can enter additional info. Do you know what would cause this?

  • Profile Image
    ashwin_d
    Answered on August 25, 2015 at 01:02 PM

    Hello samspar,

    The thread URL which you have shared is very old thread and will not work anymore.

    I did check your form and I am able to replicate the issue you are having. Can you please let us know which theme you are using?  

    Please be noted that the actual radio button is disabled and the css is applied on the label but in case of other textbox there is no label. Let me also consult my colleagues and see if it is possible to apply the same style to other text box.

    We will get back to you on this soon.

    Thank you!

     

  • Profile Image
    samspar
    Answered on August 25, 2015 at 01:27 PM

    Hi ashwin_d,

    We are using the "Big Blue" theme. Thank you for your help!

  • Profile Image
    Welvin
    Answered on August 25, 2015 at 03:52 PM

    You can inject the following custom CSS codes to fix the other box:

    input.form-radio-other{

        visibility: hidden;

    }

    input.form-radio-other:after {

        height: 10px;

        left: 11px;

        position: absolute;

        top: 7px;

        width: 10px;

        content: '';

        background-color: #bbb;

        border-radius: 50% 50% 50% 50%;

        list-style: none outside none;

        visibility: visible;

    }

    input:checked.form-radio-other:after {

    background-color: #cf202e;

    }

    Add it to the bottom of the existing codes. Here's how you can inject: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes.

    Thanks