Why are my labels wrapping rather than extending across the page?

  • leeanndumas
    Asked on July 20, 2017 at 9:55 AM

    In the builder, the labels show as extending across the form, but in the preview, they are wrapped in a space about 1/8 the size of the form. I've checked all the settings and can't figure out what to do. 

    Jotform Thread 1204061 Screenshot
  • Jan
    Replied on July 20, 2017 at 12:51 PM

    This is happening because the width of the label is set to 150px. Please inject this custom CSS to fix the issue:

    .form-label.form-label-auto {
       width: 100% !important;
    }

    Here's a guide on How-to-Inject-Custom-CSS-Codes. Here's the result:

    Why are my labels wrapping rather than extending across the page? Image 1 Screenshot 20

    Hope that helps. Thank you.

  • leeanndumas
    Replied on July 20, 2017 at 1:43 PM
    Thank you. What would be the CSS code to do that for the options in a single choice or multiple choice question?
    [cid:image001.png@01D30151.14C219C0]
    Lee Ann Dumas
    512-463-8899
    ...
  • Jan
    Replied on July 20, 2017 at 3:11 PM

    Here's the CSS code to increase the width of the options in single choice and multiple choice fields:

    .form-radio-item, .form-checkbox-item {
    max-width: none !important;
    }

    [data-type="control_radio"] .form-input, [data-type="control_checkbox"] .form-input, [data-type="control_radio"] .form-input-wide, [data-type="control_checkbox"] .form-input-wide {
    max-width: none !important;
    }

    Here's the result:

    Why are my labels wrapping rather than extending across the page? Image 1 Screenshot 20

    Hope that helps. Thank you.