How to align the form properly?

  • tashuu
    Asked on October 16, 2017 at 2:30 PM

    The entire form is now left aligned, How do i fix it? Also the form collapse fields have shrunk in size, how i get them to more width?

  • Nik_C
    Replied on October 16, 2017 at 2:53 PM

    Please insert the below CSS code in your Custom CSS Field:

    .form-all {

        margin-left: 30%!important;

    }

    .form-section-closed {

      width:750px!important;

    }

    .form-section {

        width: 750px;

    }

    That should make the form look like this:

    1508179951Screen Shot 2017 10 16 at 8 Screenshot 10

    Let us know how it worked.

    Thank you!

  • tashuu
    Replied on October 16, 2017 at 4:16 PM

    It did move it but more to the right now.
    May be because i already have something in the css.


    .form-header-group {

        background : transparent;

    }


    .form-all {

        margin-top : -120px!important;

    }


    .form-all {


        margin-left: 30%!important;


    }


    .form-section-closed {


      width:750px!important;


    }


    .form-section {


        width: 750px;



    }


    what should i keep and remove?

  • jonathan
    Replied on October 16, 2017 at 4:58 PM

    You can also just remove all the existing CSS and replace it with the one suggested by Nik_C.

    I do see it was a bit more to the right with that CSS code. So you need to adjust the number margin-left %... try it at 25%

    Ex:

    .form-all {

        margin-left: 25%!important;

    }

    .form-section-closed {

      width:750px!important;

    }

    .form-section {

        width: 750px;

    }

    ----


    Check my test form https://form.jotform.com/72886119586977