How do I display the form nicely on mobile?

  • Profile Image
    ablt
    Asked on October 10, 2019 at 05:13 AM

    Hi,

    When my forms are viewed in mobile, the words get cut at at random places to start the new line. Is there a way to make sure that the word starts on the new line instead of getting cut in half?

    Please refer to the attached image for an example of this happening. 

    Kind regards,

    Pierre1570698740DE5E3B48-6E5E-4A43-AF04-53AFB0

  • Profile Image
    VincentJay
    Answered on October 10, 2019 at 05:53 AM

    Hi,

    Maybe we can try injecting custom CSS code to the form to adjust the width of the question text. Please share the form URL so we can check it further. 

    Here's a guide: https://www.jotform.com/help/401-Where-to-Find-My-Form-URL

    We'll wait for your response. 

  • Profile Image
    ablt
    Answered on October 18, 2019 at 12:42 AM

    Thanks Vincent,

    I replied to the email last week but it doesn't look like that goes through to you guys.

    URL is: https://form.jotform.co/ablt/above--beyond-questionnaire

  • Profile Image
    Jed_C
    Answered on October 18, 2019 at 03:24 AM

    You can try the CSS code below:

    @media only screen and (max-width: 480px){

    .form-matrix-row-headers, .form-matrix-column-headers {

    word-break: break-word;

    }

    }

    This should not separate the text of the word in another line.

    ex.

    1571383341Clone of Above & Beyond Questi

    If you want the text in a single line, you can use the CSS code below.

    @media only screen and (max-width: 480px){

    .form-matrix-row-headers {

    white-space: nowrap;

    }

    }

    1571383465no_wrap.gif

    I hope that helps. Let us know if you have any questions or if you need further assistance.