bookmark_borderMulti-Page Forms

Progress Bar

Container

  • example: multi-page form progress bar container (div) – applies to all forms
        body .gform_wrapper .gf_progressbar_wrapper {border: 1px solid red}
        

  • example: multi-page form progress bar container (div) – applies just to form ID #1

        body #gform_wrapper_1 .gf_progressbar_wrapper {border: 1px solid red}
        

Progress Bar

  • example: multi-page form progress bar (div) – applies to all forms

        body .gform_wrapper .gf_progressbar_wrapper .gf_progressbar {border: 1px solid red}
        

  • example: multi-page form progress bar (div) – applies just to form ID #1

        body #gform_wrapper_1 .gf_progressbar_wrapper .gf_progressbar {border: 1px solid red}
        

Progress Bar Title

  • example: multi-page form progress bar title (h3) – applies to all forms

        body .gform_wrapper .gform_body .gf_progressbar_wrapper .gf_progressbar_title {color: red}
        

  • example: multi-page form progress bar title (h3) – applies just to form ID #1

        body #gform_wrapper_1 .gform_body .gf_progressbar_wrapper .gf_progressbar_title {color: red}
        

Percentage Completed

  • example: multi-page form progress bar – percentage completed (div) – applies to all forms

        body .gform_wrapper .gf_progressbar_wrapper .gf_progressbar .gf_progressbar_percentage {border: 1px solid red}
        

  • example: multi-page form progress bar – percentage completed (div) – applies just to form ID #1

        body #gform_wrapper_1 .gf_progressbar_wrapper .gf_progressbar .gf_progressbar_percentage {border: 1px solid red}
        

Steps

Container

Contains the user-defined steps text

  • example: multi-page form steps container (div) – applies to all forms
        body .gform_wrapper .gf_page_steps {border: 1px solid red}
        

  • example: multi-page form steps container (div) – applies just to form ID #1

        body #gform_wrapper_1 .gf_page_steps {border: 1px solid red}
        

All Steps

  • example: multi-page form step (div) – applies to all forms

        body .gform_wrapper .gf_page_steps .gf_step {color: red}
        

  • example: multi-page form step (div) – applies just to form ID #1

        body #gform_wrapper_1 .gf_page_steps .gf_step {color: red}
        

Active Step

  • example: multi-page form active step (div) – applies to all forms

        body .gform_wrapper .gf_page_steps .gf_step_active {color: red}
        

  • example: multi-page form active step (div) – applies just to form ID #1

        body #gform_wrapper_1 .gf_page_steps .gf_step_active {color: red}
        

Page

Wraps each “paged” set of fields

  • example: multi-page form page (div) – applies to all forms
        body .gform_wrapper .gform_body .gform_page {border: 1px solid red}
        

  • example: multi-page form page (div) – applies just to form ID #1

        body #gform_wrapper_1 .gform_body .gform_page {border: 1px solid red}
        

Footer

Contains previous and next paging buttons

  • example: multi-page form footer (div) – applies to all forms
        body .gform_wrapper .gform_body .gform_page_footer {border: 1px solid red}
        

  • example: multi-page form footer (div) – applies just to form ID #1

        body #gform_wrapper_1 .gform_body .gform_page_footer {border: 1px solid red}
        

Buttons

Next Button

  • example: multi-page form – next button (input) – applies to all forms

        body .gform_wrapper .gform_body .gform_page_footer .gform_next_button {border: 1px solid red}
        

  • example: multi-page form – next button (input) – applies just to form ID #1

        body #gform_wrapper_1 .gform_body .gform_page_footer .gform_next_button {border: 1px solid red}
        

Previous Button

  • example: multi-page form – previous button (input) – applies to all forms

        body .gform_wrapper .gform_body .gform_page_footer .gform_previous_button {border: 1px solid red}
        

  • example: multi-page form – previous button (input) – applies just to form ID #1

        body #gform_wrapper_1 .gform_body .gform_page_footer .gform_previous_button {border: 1px solid red}
        

Submit Button

  • example: multi-page form – submit button (input) – applies to all forms

        body .gform_wrapper .gform_body .gform_page_footer .gform_button {border: 1px solid red}
        

  • example: multi-page form – submit button (input) – applies just to form ID #1

        body #gform_wrapper_1 .gform_body .gform_page_footer .gform_button {border: 1px solid red}