Need help with a ccs code that will allign all buttons, images, and form entries to the center

  • bcarmanIBB
    Asked on December 26, 2018 at 10:22 AM

    Hello, I have been trying to use some suggested ccs codes to align my entire form in the center but am having no luck, can you please help?

    https://form.jotform.com/bcarmanIBB/HELP 

  • Richie JotForm Support
    Replied on December 26, 2018 at 10:37 AM

    To center your form fields, you may use these custom CSS code.

    .form-line label, .form-line div {

    margin: auto !important;

    text-align: center !important;

    }


    If you want to include the submit and next buttons, kindly add this CSS code.

    .form-pagebreak-next,.form-pagebreak-back{
        margin-left: 290px !important;
    }

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

  • bcarmanIBB
    Replied on December 26, 2018 at 10:43 AM
    Thanks for your help. It still looks kind of funny. The labels are now very close to the response areas and the bullet points are super far away from the selection options. Also my input grids did not center.
    [cid:image001.png@01D49D07.91F4ABD0]
    [IBB-001 Logo color]
    Brian Carman
    Program Development Director
    (317) 233-0090
    10 W. Market Street
    Suite 2410
    Indianapolis, IN 46204
    [https://media.licdn.com/dms/image/C4E12AQGPwaGUxvHKGQ/article-inline_image-shrink_1000_1488/0?e=1545868800&v=beta&t=Y4gApH_NRVj3yC-TPSQKoFRq6dS-5u7e5J9MuMh0b1E]
    ...
  • Richie JotForm Support
    Replied on December 26, 2018 at 10:59 AM

    To adjust the margin between the label and the text entries, you can use this CSS code.

    .form-textbox,.form-textarea{
      margin-top: 10px;
    }
    #cid_47{
            margin-left: 180px;
    }

    Sample Screenshot:

    Need help with a ccs code that will allign all buttons, images, and form entries to the center Image 1 Screenshot 20

    Kindly preview your form using another web browser or in incognito mode.

    Let us know if the issue still remains.

  • bcarmanIBB
    Replied on December 26, 2018 at 12:43 PM
    Thanks, do I edit the numbers in there to adjust?
    [IBB-001 Logo color]
    Brian Carman
    Program Development Director
    (317) 233-0090
    10 W. Market Street
    Suite 2410
    Indianapolis, IN 46204
    [https://media.licdn.com/dms/image/C4E12AQGPwaGUxvHKGQ/article-inline_image-shrink_1000_1488/0?e=1545868800&v=beta&t=Y4gApH_NRVj3yC-TPSQKoFRq6dS-5u7e5J9MuMh0b1E]
    ...
  • Richie JotForm Support
    Replied on December 26, 2018 at 12:56 PM

    Yes, you may edit the numbers to adjust.

    .form-textbox,.form-textarea{
      margin-top: 10px;
    }
    #cid_47{
            margin-left: 180px;
    }

    May we know what fields do you want to adjust?

    You can post screenshots in the thread by following this guide:-How-to-add-screenshots-images-to-questions-to-the-support-forum