How to align the form properly?

  • Profile Image
    tashuu
    Asked on October 16, 2017 at 02: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?

  • Profile Image
    Nik_C
    Answered on October 16, 2017 at 02: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.55

    Let us know how it worked.

    Thank you!

  • Profile Image
    tashuu
    Answered on October 16, 2017 at 04: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?

  • Profile Image
    jonathan
    Answered on October 16, 2017 at 04: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