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 change a field label width

    Asked by aprpac on July 03, 2015 at 03:26 PM
    Also, I would like to move the Text fields closer to the "Message x" labels. How do I do this?
  • Profile Image
    JotForm Support

    Answered by Mike on July 03, 2015 at 03:43 PM

    The field Label Width is globally changed via form Preferences.

    Otherwise, we will need to inject custom CSS in order to style the field labels individually.

    If you need any further assistance on this, please let us know.

  • Profile Image

    Answered by aprpac on July 03, 2015 at 04:11 PM

    Mike,

    Thanks for this info. Please can you explain the CSS I need to inject to JUST change the "Message x" widths.

    Thanks

    Paul

  • Profile Image
    JotForm Support

    Answered by Mike on July 03, 2015 at 05:24 PM

    For example, we can set a maximum width for the message labels. Try the next CSS:

    /* Step 3 - Label Width*/

    #id_74 label, #id_80 label, #id_79 label, #id_78 label, #id_77 label, #id_76 label, #id_82 label, #id_81 label , #id_75 label {

        max-width: 100px;

    }

    /* Step 7 - Label Width*/

    #id_95 label, #id_96 label, #id_97 label, #id_98 label, #id_99 label, #id_100 label, #id_101 label, #id_102 label , #id_103 label {

        max-width: 100px;

    }

    /* Step 10 - Label Width*/

    #id_116 label, #id_117 label, #id_118 label, #id_119 label, #id_120 label, #id_121 label {

        max-width: 100px;

    }

    Thank you.