Css is not applying on the last pages when resize the screen

[aakashbumiya]

original screen Resized screen

[aakashbumiya]

var opt = { margin: [0.5, 0.2, 0.5, 0.2], filename: filename, html2canvas: { scale: 1}, jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' }, };

html2pdf().set(opt).from(contentDiv).save();

using this configuration for PDF creation and <div className="html2pdf__page-break"></div> for page break

[cablegunmaster]

"Css is not applying on the last pages when resize the screen "

do you got by any chance https://www.w3schools.com/css/css_rwd_mediaqueries.asp CSS Media querys and or bootstrap activated on your pages? This might mess up the layout.

Question is, is this also happening on the HTML version or only on the PDF? please double check if this is the case. Otherwise it might have to do with page counting.

Try to add this piece of css before you add the CSS of the pages to prevent the browser to add its own css and hopefully count the pages better.

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

https://meyerweb.com/eric/tools/css/reset/