Make all fields centered

  • dreamfulkids
    Asked on March 28, 2020 at 4:16 PM

    Hi everyone,


    I would like to have all of my form questions centered and the submit/next buttons centered.

    Additionally, how do I remove the line above the the navigation buttons (back/next, submit).


    Thank you for helping with these issues I greatly appreciate it.


    Best,

    Chris



    Jotform Thread 2230679 Screenshot
    Page URL: https://form.jotform.com/200862020039039
  • John Support Team Lead
    Replied on March 28, 2020 at 8:38 PM

    Hello Chris - Could you please try replacing your existing custom CSS codes in the form with this one?

    form > * > *  {margin-left:50% !important;transform: translateX(-50%)}

    This code should target all the elements of the form and make them centered.

    I have applied this to a cloned form and here's the result: https://form.jotform.com/200877452191962

    GUIDE: How-to-Inject-Custom-CSS-Codes

  • dreamfulkids
    Replied on March 30, 2020 at 2:28 AM

    Hi JohnRex,

    The second question with the image radio widget is broken when I looked at your cloned form and also when I tested the CSS you supplied.

    How can I fix this?

    Thanks!

  • Sam_G
    Replied on March 30, 2020 at 9:03 AM

    Hello Chris,

    I'll be cloning the form and will update you on this thread.

    Sam

  • Sam_G
    Replied on March 30, 2020 at 9:35 AM

    Hello Chris,

    Kindly change the image settings to 210:175. Go to Widget settings> Scroll down to Image Size.

    Make all fields centered Image 10

    Kindly use this CSS code:

    .form-input-wide {

        text-align : center !Important;

        width : 650px;

    }

    You may use this guide on How to Inject CSS codes.

    https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    Let us know if that worked for you.

    Sam