What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to keep radio button label text from wrapping to left margin

    Asked by mgcaledonian13 on September 16, 2014 at 06:54 AM

    I think that this what I want as well but the image link is not there, can you please repair the link.

    Thanks,

    left margin radio label label radio input text input label style
  • Profile Image

    Answered by Ben on September 16, 2014 at 09:05 AM

    Hi,

    I believe that this is the form you want to align the text properly?
    http://www.jotformpro.com/form/42547329002954

    Do let me know if that is not the right form.

    To fix the layout of your radio boxes, we must increase their width and make the words not break out.

    This is a clone of your form where I have applied the style so that you can see how it looks:
    http://form.jotformpro.com/form/42583301172952

    To make your form radio buttons look like that, just inject this CSS code:

    .form-multiple-column .form-radio-item, .form-multiple-column .form-checkbox-item
    {
        display: inline-block;
        min-width: 200px;
        white-space: nowrap;
        width: 200px;
    }

    This will show them nicely in all 3 columns ;)

    Please follow these steps to inject the CSS code above into your form:How to Inject Custom CSS Codes

    Do let me know how this works for you :)

    Best Regards,
    Ben