Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

While using pagebreak avoid-all creates a blank first page #672

Open
zameelnp opened this issue Dec 29, 2023 · 1 comment
Open

While using pagebreak avoid-all creates a blank first page #672

zameelnp opened this issue Dec 29, 2023 · 1 comment

Comments

@zameelnp
Copy link

zameelnp commented Dec 29, 2023

const opt = {
margin: [10, 10, 10, 10],
image: { type: 'jpeg', quality: 1 },
html2canvas: {
scale: 3,
letterRendering: true,
useCORS: true
},
jsPDF: {
unit: 'mm', format: 'letter', orientation: 'portrait', putOnlyUsedFonts: true,
},
pagebreak: {
mode: ['avoid-all', 'css', 'legacy'],
}
};
html2pdf().from(modifiedHtmlContent).set(opt).save()
if i remove this avoid-all mode then it is working fine. but i know that this will mess up page break. so i have added avoid: ['tr', 'table', 'div', 'p', 'span']. But unfortunately this also creating blank first page.
so i have remove span from avoid then it is working fine. @eKoopmans could you please give me a solution for this? how can i work this page break without any issues?
my html content is:
<p><span style="font-size: 24px;"><strong>I EMS of </strong></span><a style="color: blue; cursor: pointer;" title="Vendor Business Address" contenteditable="false" data-item="fieldTag">&lt;vendor_business_address&gt;</a><span style="font-size: 24px;"><strong> </strong></span></p> <p> </p> <p><span style="font-size: 24px;"><strong>on this date </strong></span><a style="color: blue; cursor: pointer;" title="Bill Date" contenteditable="false" data-item="fieldTag">&lt;bill_date&gt;</a><span style="font-size: 24px;"><strong> </strong></span><br><br><span style="font-size: 24px;"><strong>for this bill </strong></span><a style="color: blue; cursor: pointer;" title="Bill Name" contenteditable="false" data-item="fieldTag">&lt;bill_name&gt;</a><span style="font-size: 24px;"><strong> </strong></span></p> <p><span style="font-size: 24px;"><strong>served this customer </strong></span><a style="color: blue; cursor: pointer;" title="Customer Name" contenteditable="false" data-item="fieldTag">&lt;customer_name&gt;</a><span style="font-size: 24px;"><strong> </strong></span></p> <p> </p> <p><a style="color: blue; cursor: pointer;" title="Claimant Signature" contenteditable="false" data-item="fieldTagSignature">&lt;claimant_signature&gt;</a><span style="font-size: 24px;"><strong> </strong></span></p> <p><span style="font-size: 24px;"><strong> Send On </strong></span><a style="color: blue; cursor: pointer;" title="Current Date" contenteditable="false" data-item="fieldTag">&lt;current_date&gt;</a><span style="font-size: 24px;"><strong> </strong></span></p>

@zaosoula
Copy link

pagebreak can accept css selectors, you should try to use :not(:first-child), :first-child to exclude to prevent the first page break

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants