Options in a Multiple Choice Field overlapping with each other

  • Ryan
    Asked on February 20, 2018 at 10:56 AM

    I made a form that has 3 column in a radio box list.


    The text is overlapping the columns. How do I fix this?


    https://walshfluor.businesscatalyst.com/index.html

    The navi is not fully functional. Please scroll.

    Jotform Thread 1390337 Screenshot
  • Mike_G JotForm Support
    Replied on February 20, 2018 at 12:52 PM

    I have checked your form and I see that you have shrunk 3 Multiple Choice Fields to fit into the width of your form which you set to 900px. We can try to fix the issue you described by injecting custom CSS codes to your form to increase the widget of each field. However, I just want to point out that I noticed that you are trying to make the 3 Multiple Choice Fields to look like they belong to the same field label. One example is the one in the screenshot you shared with us — there are 3 Multiple Choice Fields that looks like they are all under "Check All That Apply" field.

    How would you like to try having all the options in all the 3 fields to be only in 1 Multiple Choice Field? Then, you can just spread the column of that single Multiple Choice Field to 3 columns and inject Custom CSS codes to fit it to the form width even more.

    Here's a clone version of your form where I have applied a solution to your issue — https://form.jotform.com/80504568270961

    Please feel free to clone the form to your account so you can inspect it — How-to-Clone-an-Existing-Form-from-a-URL


    Please let us know if you want to have your form to look like that and if the options in each Multiple Choice Field should have a particular order.

    We will wait for your response.

  • Rynodesign
    Replied on February 20, 2018 at 1:43 PM
    Thank you for taking a look.
    I would love for them to all me one field instead of three. Is that
    possible?
    That form would be super long if it was just one column. I was trying to
    save the user form having scroll for 10 minutes. Is there another way I
    should have set it up?
    Thanks!
    ...
  • Rynodesign
    Replied on February 20, 2018 at 1:43 PM
    They just need to be in the order they are, from left to right.
    ...
  • TREVON
    Replied on February 20, 2018 at 2:39 PM

    You can achieve this as illustrated by my colleague by using the "Multiple Choice Field" as this will allow you to have one field with three rows, hence meeting your need of preventing users from scrolling through the one long list.

    You will need to clone and edit the form shared by may colleague or you can recreate the same form by removing the current field you have in your form with the "Multiple Choice field".

    https://form.jotform.com/80504568270961

    https://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL

    Kindly do let us know if you need further assistance.


  • Rynodesign
    Replied on February 22, 2018 at 2:43 AM
    THANK YOU SO MUCH! I really apeicate your help.
    ...