Form fileds don't fit. How do I make them fit?

  • Profile Image
    atrsports
    Asked on August 13, 2019 at 07:53 PM

    Copied this form from the "volunteer application" suggestions.

    Some of the fields are not fitting. Specifically the "Receive Texts" field, {receiveTexts}. What am I missing?

  • Profile Image
    Augustine_O
    Answered on August 13, 2019 at 08:36 PM

    Hello, 

    To fix the text boxes, you could consider injecting the CSS code below to the form

    .form-single-column {
       display: inline-block;
    }

    Here is our guide on How to Inject CSS Codes to a form

    1565742890Desktop 2019-08-13 20-33-16.pn

    I hope this helps. 

    Please let us know if you need anything else. 


    Thanks.

  • Profile Image
    atrsports
    Answered on August 13, 2019 at 08:42 PM

    Thank you Augustine, you're a lifesaver! For the purposes of learning, what exactly are you directing the form to do?

  • Profile Image
    AshtonP
    Answered on August 13, 2019 at 10:35 PM

    I guess you want to know what display CSS code does. The code is basically asking to stay Single column to stay in a specific block so its height and width match the other elements on the form. 

    You can read more about it here.

  • Profile Image
    atrsports
    Answered on August 13, 2019 at 10:52 PM

    Thanks Ashton. To what dimensions do default fields conform? Why did the field not fit in the first place?

  • Profile Image
    Jed_C
    Answered on August 14, 2019 at 04:23 AM

    The owner of the form and the form itself is no longer available so I can't view why it copied the fields that way. The template was published a long time ago (2013), it probably wasn't updated to version 4 of Jotform builder causing some issues when used as a template.

    Normally, what you see on the template page is what you will on the actual cloned form, but this case it doesn't seem to match. If you need help with this form, just let us know.