Align radio buttons in 2 columns with allow other text box

  • Haler
    Asked on December 22, 2014 at 7:16 PM

     A. Here is where I started (see attached file: Started with Radios.JPG)

    B. Here is the process I used:

    1. With your form in Edit mode (> = Click)

    2. >The field area to make the change to.

    3. >Setup & Embed (in the secondary menu row

    4. >Preferences in the Primary menu row

    5. >Form Style (in the Preferences menu

    6. In the right side, Paste the following CSS code:

    .form-multiple-column span:last-child {
          clear: none !important;

    }

    7.                                       > [ Close Settings ]

    BUT I need
         The 6th Alternative Radio "Other" aligned horizontally with its Button, as are the others.
         The Horizontal Spacing between the two rows to be approximately 1/4".
         The top row of Radio buttons to be aligned on the same row and top line of the Label text.

    Thanks so much for your help and patience.

    Dwight

    Jotform Thread 481051 Screenshot
    Page URL: http://www.jotform.com//?formID=43398844145161
  • Kiran Support Team Lead
    Replied on December 22, 2014 at 11:03 PM

    Is this how you are looking to align the field?

    Align radio buttons in 2 columns with allow other text box Image 1 Screenshot 30

    You can achieve this from the Form Designer by changing the input width around 240px for this radio button field along with your added CSS code.

    Align radio buttons in 2 columns with allow other text box Image 2 Screenshot 41

    Hope this information helps. Please let us know if you need any further assistance.

    Thanks!

  • Haler
    Replied on December 23, 2014 at 4:54 AM

    Hi Kiran,

    Thanks, I tried to send details several hours ago but when I checked back just now I found what appears that you got nothing.

    In summary: YES, what you sent was what I need but I couldn't get it to work.  I played around with the number around 240, but nothing I tried got the "Other"Radio button to move from the left column to the right.

    There was a note you sent, in red, but I could not find any other properties that seemed to make a 
    difference.

    Is there anything more that you can tell me?

    Thanks for what looked like a sure simple way to solve the problem.  I hope someone knows.

    With much appreciation

  • val
    Replied on December 23, 2014 at 9:00 AM

    Hi,

    Please find this CSS code in your CSS files "max-width:220px;" and replace to "max-width:240px;".

    And here is the guide on how to inject custom CSS code to your form:

    http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    Please get back to us if the issue still persist.

    Thanks.