Increase the width of the input field for name

  • Profile Image
    pixelww
    Asked on June 18, 2021 at 07:43 AM

    Hi, most of the forms I will be creating will be printed. Is there a way to lengthen the first and last name fields to allow people to write on the print outs? (see form in account) Thanks!

  • Profile Image
    Billy_G
    Answered on June 18, 2021 at 10:25 AM

    Hi there!

    I hope you're doing well and thanks for reaching out.

    There are a couple of ways on how to increase the width of the input field for the first and last name. Please see the details below:

    1. Un-shrink the element. Click the Properties icon -> Advanced -> Disable Shrink element
      1624025934_60ccab4e0815e_
    2. If you want both the first and last name field to take up the whole row, you can inject the CSS code below:
      1624026065_60ccabd1b8eb0_
      Here's our guide on how to inject CSS code into your form.

    Code:

    #cid_8 div {
      display: flex;
      flex-direction: column;
    }

    #cid_8 div span {
      margin: 0;
      width: 100%
    }

    Let us know if you need further assistance.

  • Profile Image
    pixelww
    Answered on June 18, 2021 at 11:11 AM

    Thanks, I appreciate your help! I don't think I can inject the CSS into the PDF form. These will not be online (YET).

    Any suggestions?

  • Profile Image
    Alexander_G
    Answered on June 18, 2021 at 04:15 PM

    Greetings, 👋


    "I don't think I can inject the CSS into the PDF form. These will not be online (YET)."

    Please, could you share some details on your request?

    Do you want to increase the width of the input form in the PDF form or it's the name of your form?


    You can inject this code even if your form isn't published.


    Thanks,
    Alex

  • Profile Image
    pixelww
    Answered on June 18, 2021 at 05:12 PM

    Hi and thank you Alex - please see the screenshot, I don't have that CSS option in the PDF Editor.1624050779_60cd0c5b4765c_CSS-helper.png

  • Profile Image
    Billy_G
    Answered on June 18, 2021 at 07:39 PM

    You're right. You can not inject CSS code in the PDF editor. The PDF form just copies the online form connected to it. However, when you make changes to the online form, it will not automatically reflect on the PDF form.

    What we need to do is to inject the CSS code in the online form first. Then, create a new online PDF form by clicking +New PDF.

    Let us know if you need further assistance.