Multi-page Print Form CSS/HTML Not Working.

I have a multi-page form that I have added the following CSS:

@media print{

 

    .pageBreak {

 

        page-break-after : always !important;

 

    }

 

}

And inserted the following HTML: <div class="pageBreak"> </div> where I want a printed page break. I have cleared the Form cache and the browser cache, Google Chrome.

The desired result of printing a new page after this code is entered is not working. There are approx. 25 - 26 pages that I need the user of the form to be able to print, with page breaks where I set them in the back-end of the form, using Google Chrome browser only.

JotForm: https://form.jotform.com/63275744442156?session=

I checked the print feature on your form and it seems to be working properly. No fields were overlapping on the print preview.

Does the issue still persist on your end? Can you please try replacing the current CSS with the one below instead:

@media print{

    .pageBreak {

        page-break-before : always;

        page-break-inside : avoid;

    }

}

Regards.

Thank you
- I have one additional follow-up question, please -
Please see the attached screenshot and the notation. I need to know if the notated items may be excluded from the Print function so that they do not print out with the rest of the form?
...

Unfortunately attached images are not visible in the forum. To send an image to the thread, please visit your thread here https://www.jotform.com/answers/1035085 and follow this guide on How to add screenshots/images to questions to the support forum?

You can also list here the names of the fields that you want to exclude from the print and we will see if it is possible to hide them when printing.

I will wait for your response.
Regards.

The very Last Three fields of the Form:
"IMPORTANT" Print form BEFORE submitting. Submitting clears the Form of ALL entries!"
"CLICK Submit Form after you have Printer It!"
"Submit Form" Button
This prints out an extra page and it is not needed or required.
I still need these to appear on the Form itself - Just not the printed version.
...

Please insert the yellow highlighted code below inside the @media print { ... } section of your form css code to hide the three specified fields from printing. 

@media print{

   .pageBreak {

        page-break-before : always;

        page-break-inside : avoid;

    }

   #id_342, #id_344, #id_340 {

       display: none!important;

   }

}

If you need further assistance, please let us know.
Regards.