php - DOMPDF invoices with multiple pages -
i'm creating invoices using dompdf. need have content of invoice flow on many pages needed , have total $ due @ bottom of invoice.
i first tried having fixed height div absolute-positioned footer, invoice details can extend onto footer.
what need have min-height main div , add padding @ bottom of said div footer, min-height doesn't seem work.
i've tried making whole page table, don't want table rows split onto multiple pages (so keep totals on same page.)
any solutions ?
edit
sample html (absolute positioning) :
<div id="main" style="height:10in;width:7in;position:relative;"> <!-- header here, ok --> <!-- content, dynamic height --> <!-- footer --> </div> sample html (tables) :
<table width="100%"> <tr><!-- header --></tr> <tr><!-- content --></tr> <tr><!-- footer --></tr> </table> the footer should never split, , @ end of document. if content fills page, footer should @ end of page.
the ideal solution use page-break-before: avoid on footer. provide minimum of coverage under scenario (i.e. single table row pulled it), @ least footer wouldn't solo.
<!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <style> div { width: 100%; margin: .25em; } span { width: 33%; display: inline-block; } div#footer { text-align: right; border-top: 1px solid black; page-break-before: avoid; } </style> </head> <body> <div><span>count</span><span>item</span><span>item total</span></div> <div><span>1</span><span>widget</span><span>x.xx</span></div> <div><span>1</span><span>widget</span><span>x.xx</span></div> ... <div><span>1</span><span>widget</span><span>x.xx</span></div> <div><span>1</span><span>widget</span><span>x.xx</span></div> <div id="footer"> <p>total: x.xx</p> </div> </body> </html> unfortunately page-break-before doesn't work on tables. provide work around in situation i'll begin assumption: footer can @ bottom of page, regardless of how far down content comes.
in case can work around problem because of quirk in how dompdf processes document content. namely, elements rendered encountered. fixed-position element rendered on pages starting page on encountered. not appear on previous pages.
this quirk v0.6.0 , may change in future.
so can place footer @ end of document using position: fixed or position: absolute page margin shift footer. following:
<!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <style> @page { margin: 1in; } table { width: 100%; } div#footer { width: 100%; position: absolute; bottom: -.35in; text-align: right; border-top: 1px solid black; } </style> </head> <body> <table> <tr><td>count</td><td>item</td><td>item total</td></tr> <tr><td>1</td><td>widget</td><td>x.xx</td></tr> <tr><td>1</td><td>widget</td><td>x.xx</td></tr> ... <tr><td>1</td><td>widget</td><td>x.xx</td></tr> <tr><td>1</td><td>widget</td><td>x.xx</td></tr> </table> <div id="footer"> <p>total: x.xx</p> </div> </body> </html> with above code footer appear on last page @ bottom of page.
Comments
Post a Comment