html - Repeat thead on each page generating pdf using iTextSharp -
generating html pdf using itextsharp library. scenario different have here 1 tr
in repeating number of div
after conversion overlapped.
sharing images/code clarify.
<html> <head> <style> body { margin: 0; } table { width: 100%; border-spacing: 0; border-collapse: collapse; text-align: center; } thead.t1 { background: #dac8c8; } table td, table th { padding: 10px; } table { margin-top: 20px; } @media print { @page { size: a4 landscape; } } thead { display: table-header-group } table { -fs-table-paginate: paginate; } @media print { thead { display: table-header-group; } } .div-tr>div { width: 200px; display: table-cell; vertical-align: inherit; padding: 10px; } .div-tr { page-break-inside: avoid; display: table-row; vertical-align: inherit; border-color: inherit; } </style> </head> <body class="" style="width:1070px; margin:0 auto;"> <div style="height:300px; width:100%; background:#ccc; border-bottom:2px solid #000;"> </div> <table class=""> <thead class="t1"> <tr> <th> column1 </th> <th> column2 </th> <th> column3 </th> <th> column4 </th> <th> column5 </th> <th> column6 </th> <th> column7 </th> <th> column8 </th> </tr> </thead> <tbody> <tr> <td colspan="8" class="no-break"> <div class=" "> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> <div class="div-tr"> <div> column td1 </div> <div> column td2 </div> <div> column td3 </div> <div> column td4 </div> <div> column td5 </div> </div> </div> </td> </tr> </tbody> </table> </body> </html>
Comments
Post a Comment