How to align fields on form centered on mobile devices?

  • Profile Image
    ebuabua
    Asked on April 03, 2018 at 04:58 AM

    Hi,

    Can you fix my form so that all of my writing on this form is centered?

    https://form.jotform.com/80857775884983


  • Profile Image
    Victoria_K
    Answered on April 03, 2018 at 07:48 AM

    Unfortunately, I am not sure if I undersood your query. 

    If you need to centrilize your form on the page, please remove the following part of your custom CSS code:

    1522755949screenshotczr2u.png

    I can also suggest to try using the Advanced Designer for advanced styling of your form:

    1522756102screencast3.gif

    Hope this helps. But, if you need further assistance, please let us know.

  • Profile Image
    ebuabua
    Answered on April 03, 2018 at 08:43 AM
    When I'm looking at the form from a phone, some of the writing is off
    centered.
    ...
  • Profile Image
    Victoria_K
    Answered on April 03, 2018 at 10:17 AM

    Thank you for clarifications. 

    Now I can suggest adding custom css codes to align fields on mobile devices. 

    Here is the code:

    @media screen and (max-width: 480px), screen and (max-device-width: 767px) and (orientation: portrait), screen and (max-device-width: 415px) and (orientation: landscape) {

      .form-input, .form-header, .form-input-wide, .form-textarea, .form-textbox, .form-dropdown {

        width: 250px !important;

      }

      p {

        text-align: center !important;

      }

    }

    How-to-Inject-Custom-CSS-Codes

    Supposed output:

    1522764940screencast3.gif

    If you need any other assistance as to your JotForms, please let us know.