How to Center Multiple Fields?

  • snaplash
    Asked on February 17, 2016 at 8:41 AM

    Hey Jotform!

     

    Could you please show me how to center multiple fields on my form - https://form.jotform.com/60441233441948

    How to Center Multiple Fields? Image 1 Screenshot 20

    I would like the section between the two lines to be centered. How would I acheive this? Should I add the fields to a div in html and then style that div?

     

    Any help would be greatly appreciated!

  • Charlie
    Replied on February 17, 2016 at 11:35 AM

    I checked your form and it seems like you have an extensive styling on it. I see there's a lot of custom CSS code on it.

    You cannot position them in center because each field is of a different element, and there's no element that wraps them. The idea to wrap them in <div> and style that will work, but you'll need to use the form's full source code for that. 

    You can just adjust margin-left of the first element on the line to move it on the center. I presume your styling on your form is fixed and is not mobile responsive.

    You can this custom CSS code:

    #id_66 {

        margin-left: 12% !important;

    }

    #id_61 {

        margin-left: 12% !important

    }

    You can see how it looks like in this cloned form that I have: https://form.jotform.com/60474453982968. You can adjust the margin value depending on your preference.

    Let us know if that works.

  • snaplash
    Replied on February 17, 2016 at 11:52 AM

    Thank you Charlie.

     

    It is not exactly what I was looking for, but it is certainly a work around and one that I am very happy with.

     

    Thank you again;

  • Charlie
    Replied on February 17, 2016 at 1:07 PM

    I'm glad to hear that it somehow helped. If you needed more assistance on this, please feel free to let us know. Thank you.