I am using itext7.pdfhtml to convert html to A4 PDF. The library works great but I am having trouble with some white spacing in the html table TD's. Please see attached screen white the white space is highlighted in yellow.
Based on the knowledge I have with CSS and HTML I adjusted some styles and html attributes, but still having white space.
What I tried so far I tried to adjust CSS and HTML attributes to reduce the white space, I am able to get it some extent but not fully. Programming language is c#
What I am expecting I am expecting to remove white space highlighted in the image.
Reproducible code using link: https://itextpdf.com/demos/convert-html-css-to-pdf-free-online
<!DOCTYPE html>
<html>
<body>
<style>
#header {
position: running(header);
}
#footer {
position: running(footer);
}
@page {
margin-top: 375px;
/*margin-bottom: 20px;*/
width: 100%;
border: 1px solid #000000;
padding: 20px;
/*padding-bottom: 0px;*/
border-top: none;
border-bottom: none;
@top-center {
content: element(header);
border: 1px solid #000000;
margin-top: 40px;
padding: 20px;
border-bottom: none;
}
@bottom-center {
content: element(footer);
border: 1px solid #000000;
margin-bottom: 40px;
/*padding: 20px;*/
border-top: none;
}
}
@page wide {
size: a4 landscape;
}
#current-page-placeholder::before {
content: counter(page);
}
#total-pages-placeholder::before {
content: counter(pages);
}
table { page-break-after:auto;page-break-inside:avoid; }
tr { page-break-inside:avoid; page-break-after:auto }
td { page-break-inside:avoid; page-break-after:auto }
thead { display:table-header-group }
tfoot { display:table-footer-group }
table {
border-collapse: collapse;
}
td, h1, h2, h3, h4, h5, h6 {
font-family: Arial, Helvetica, sans-serif;
}
.pdflogo {
text-align: left;
vertical-align: top;
max-width: 300px;
}
.pagecountersection {
width: 69%;
border-spacing: 0;
font-size: 12px;
}
.pagecountersection td {
padding: 3px 10px;
font-size: 12px;
}
.ship_details {
border: 1px solid #000;
border-spacing: 0;
border-collapse: collapse;
font-size: 11px;
width:100%;
}
.ship_details td {
border: 1px solid #000;
font-size: 11px;
padding: 3px 10px;
}
.noborder td {
border: 0px solid #000;
}
.ship_header {
border: 1px solid #000;
width: 100%;
border-spacing: 0;
font-size: 12px;
}
.ship_header td {
border: 1px solid #000;
font-size: 20px;
padding: 3px 10px;
text-align: right;
}
.ship_notice {
width:100%;
border:0px solid #000000;
border-spacing:0;
border-collapse: collapse;
width:100%;
text-align: right;
font-size: 16px;
}
.breakbeforediv {
page-break-before: always !important;
}
.nobreakdiv {
page-break-inside: avoid !important;
}
.nobreakrow table, td, th {
page-break-inside: avoid;
}
.bg-gray {
background: #cccccc;
}
.bg-gray td {
background: #cccccc;
}
.breakline {
margin: 5px 0 5px 0;
}
.width40 {
width:40%;
}
.width60 {
width:60%;
}
.width100 {
width:100%;
}
.cellWithTable {
padding: 0 !important;
margin: 0 !important;
}
.cellWithTable table{
width: 100%;
}
.cellHeight {
height: 30px !important;
max-height: 30px !important;
overflow: hidden !important;
}
.firstCell {
border-top:none !important;
border-left:none !important;
border-right:none !important;
}
.middleCell {
border-left:none !important;
border-right:none !important;
}
.lastCell {
border-bottom:none !important;
border-left:none !important;
border-right:none !important;
}
.onlyCell {
border-top:none !important;
border-bottom:none !important;
border-left:none !important;
border-right:none !important;
}
.ship_nobordernopadding td {
border: 0px solid #000;
padding-left: 0px;
}
.ship_withborder td {
border: 1px solid #000;
}
#customerTabl td {
border: 0px solid #000;
padding-left: 0px;
}
</style>
<div class="breakline"></div>
<table class="ship_details" style="width:100%; border:0px solid #fff; border-spacing:0; border-collapse: collapse;">
<tr>
<td valign="top" class="ship_withborder" style="width:59%" > <!-- style="border:1px solid #000; width:59%;" -->
<table style="width:100%; border:0px solid #fff; border-spacing:0; border-collapse: collapse;">
<tr>
<td style="border:0px solid #000000; padding-top:5px; padding-bottom: 5px;" align="center">
<strong>Test Folllow Directions</strong>
</td>
</tr>
<tr>
<td style="border:0px solid #000000; padding-top:5px; padding-bottom: 5px;width: 100%; padding-left:0px;">
<table style="width:100%; border:0px solid #fff; border-spacing:0; border-collapse: collapse;" id="customerTabl">
<tr>
<td valign="top" class="ship_nobordernopadding" style="width:49%" > <!-- style="border:0px solid #000; width:49%; padding-left:0px;" -->
<table style="width:100%; border:0px solid #fff; border-spacing:0; border-collapse: collapse;">
<tr>
<td style="border:0px solid #000000; padding-top:5px; padding-bottom: 5px; padding-left:0px;">
<strong>Customer Address:</strong>
</td>
</tr>
<tr>
<td style="border:0px solid #000000; padding-top:5px; padding-bottom: 5px; padding-left:0px;">
Someone Something Llc Circle</br>
P.O. Box 123456</br>
Somecity, ST 99999-1000
</td>
</tr>
</table>
</td>
<td valign="top" class="ship_nobordernopadding" style="width:51%" > <!-- style="border:0px solid #000; width:51%; padding-left:0px;" -->
<table style="width:100%; border:0px solid #fff; border-spacing:0; border-collapse: collapse;">
<tr>
<td style="border:0px solid #000000; padding-top:5px; padding-bottom: 5px; padding-left:0px;">
<strong>Alternate Address:</strong>
</td>
</tr>
<tr>
<td style="border:0px solid #000000; padding-top:5px; padding-bottom: 5px; padding-left:0px;">
Parent Company Inc</br>
ABCD Ijkhl & Mnopqrs #111111</br>
1234 Middle Circle Way., Unit #1</br>
<span >Suite 100<br/></span>
Other City, ST 99999</br>
<span >Phone: 123-456-7890<br/></span>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="text-align: center;" colspan="2">
<strong>Note:</strong> Please include a copy of this document when mailing this.
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td valign="top" style="max-width:200px; width:200px">
<table style="width:100%; border:0px solid #fff; border-spacing:0; border-collapse: collapse;">
<tr>
<td style="border:0px solid #000000; padding-top:5px; padding-bottom: 5px;padding-left:2px;">
<strong>ABC/EFG/Ijkl Mnop Abcdefghijklm:</strong>
</td>
</tr>
<tr style="word-break:break-all;">
<td style=" border:0px solid #000000; padding-top:5px; padding-bottom: 5px;padding-left:2px; width:30%">
Sender Name:<br/>Someone Withone Llc Circle � Wills<br/>
<span >Sender Number: 20000000011112</span><br/>
Ship Name: AB Oceson Lines<br/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>