How can I center my form ?

  • Profile Image
    chrisjaeger
    Asked on January 17, 2018 at 01:13 PM

    Can you provide some guidance on how I can center the fields and boxes on the from at the bottom of this page. http://bookmoreweddings.com/diyseo-splash/


    I can't find it in the form designer, basic or advanced.


    Seems like it should be an easy-click setting.


    Thanks.


    Chris






  • Profile Image
    Marvih
    Answered on January 17, 2018 at 01:36 PM

    It seems you have found the solution by your self. Upon checking the link you shared and the direct link of the Form embedded, I was able to see it correctly centered already.

    1516214135531.png

    Direct Form URL.

    1516214152532.png


    Please let us know if this is still not resolved.

    Thanks.

  • Profile Image
    chrisjaeger
    Answered on January 17, 2018 at 01:40 PM

    Sorry, I wasn't clear enough.


    I'd like the form fields and the labels on to of the form fields to be centered.


    This is left aligned, right?


  • Profile Image
    Marvih
    Answered on January 17, 2018 at 02:01 PM

    Yes, the quickest way to center this would be inserting this custom CSS code into your Form designer's CSS field. https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    .form-label.form-label-auto {

            text-align: center !important;

    }

    1516215647533.png

    Hope that helps.

  • Profile Image
    chrisjaeger
    Answered on January 17, 2018 at 02:07 PM

    Cool. Almost. Now what about the fields?


    15162160312018-01-17_14-06-45.png

  • Profile Image
    Marvih
    Answered on January 17, 2018 at 02:37 PM

    You can manually increase the text-box to match with the others.

    1516217751534.png

    Then use this code to center align all fields.

    .form-label.form-label-auto, .form-all {

        

        text-align: center !important;

    }

    Here is the sample form I cloned from you https://form.jotform.com/80165019344957

  • Profile Image
    chrisjaeger
    Answered on January 17, 2018 at 02:55 PM

    Thank you for your help. I have this like I want it now. I noticed when you choose the email field it doesn't let you set a width. So I made it a text field with the label "email" and it let me set the width for it. ???

  • Profile Image
    Marvih
    Answered on January 17, 2018 at 03:08 PM

    The Email field width can still be found in the options tab. But it is on the bottom part.

    1516219639536.png


    We also suggest to using that field rather than the Short Text Entry.


    Thanks.