Jotform Layout: Different field alignment based on resolution

  • Profile Image
    stringtheorist
    Asked on October 17, 2014 at 11:38 AM
    Also, what would be the best way to shift all the form content to the centre of the blue box at full display view (still aligned left), but have it move to the left as the page is resized?
  • Profile Image
    raul
    Answered on October 17, 2014 at 01:05 PM

    Hello,

    Can you please confirm if you mean that you want that all your form fields appears centered for let's say desktop viewers and aligned to the left for mobile viewers?

    Do you want to animate this transition? Or you just need that the forms adapts itself depending if the viewer is using a desktop or mobile device?.

    Please let us know your thoughts and we'll do our best to provide a way to accomplish what you want.

    Thanks.

  • Profile Image
    stringtheorist
    Answered on October 17, 2014 at 02:45 PM

    I would like the form to simply adapt to the viewing device. Currently it looks good already on a mobile but on a desktop viewer the content is all over to the left, as above. I still want the left-hand alignment for all the elements but the content all moved to the centre of the blue box, if possible.

  • Profile Image
    Mike_T
    Answered on October 17, 2014 at 05:19 PM

    You can add the following CSS to injected CSS styles of your form in order to center the form fields on a desktop version of your form.

    .form-section {
    max-width: 550px;
    margin: auto;
    }

    Thank you.

  • Profile Image
    stringtheorist
    Answered on October 17, 2014 at 06:06 PM

    That's perfect! Thanks! :)