html - NetSuite 高级 PDF 模板 CSS 和 HTML 在添加额外的表格行时忽略高度并弄乱布局

Question

我有下表，它的布局很好，中间一列占页面的 70%。但是，当我取消注释前两个表格行时，它会弄乱布局，中间列只显示页面的大约 50%。水平线和“接收者:”行也会忽略任何高度和行高的变化。这是 NetSuite 高级 PDF/HTML 报告模板的一部分。

有人知道为什么吗？

            <table class="footer" style="width: 100%">
  <!-- <tr><td colspan="4" rowspan="1" style="width: 100%;"><span class="synh7recby">Received by:&nbsp;</span></td></tr>
  <tr><td colspan="4" rowspan="1" style="width: 100%; height:1px;"><hr /></td></tr> -->
  <tr>
  <td rowspan="2" style="width: 20%;"><barcode codetype="code128" showtext="true" value="${record.tranid}"/></td>
  <td colspan="2" rowspan="1" style="width: 70%;"><span class="synh9"><strong>BANKING DETAILS:</strong> Standard Bank, Company, Account No: 1, Branch Code: 2, SWIFT Addr: 3</span></td>
  <td align="right" rowspan="2" style="width: 10%;"><pagenumber/> of <totalpages/></td>
  </tr>
  <tr>
  <td rowspan="1" style="width: 34%; padding: 3px 5px 0px 0px;"><span class="synh11">The debt evidenced by this account has been ceded. No set off will be recognised. No obligation has been delegated by us and any claim or dispute will remain our responsibility.</span></td>
  <td rowspan="1" style="width: 34%; padding: 3px 0px 0px 5px;"><span class="synh11">All supplies and services shall exclusively be subject to the terms and conditions. On request, we will provide you with a copy of the terms and conditions.</span></td>
  </tr></table>

使用的 CSS:

  .synh7 {
      font-size: 10pt;
      line-height: 110%;
  }
  .synh9 {
      font-size: 8pt;
      line-height: 110%;
  }
  .synh11 {
      font-size: 7pt;
      line-height: 100%;
  }
  .synh7recby {
      font-size: 10pt;
      line-height: 70%;
  }

Answer 1

设法修复它:

            <table class="footer" style="width: 100%">
  <tr>
     <td colspan="1" rowspan="1" style="width: 20%; line-height: 100%; height: 100%;"><span class="synh9">Received by:&nbsp;</span></td>
     <td colspan="2" rowspan="1" style="width: 70%;">&nbsp;</td>
     <td colspan="1" style="width: 10%;">&nbsp;</td>
  </tr>
  <tr><td colspan="4" rowspan="1" style="width: 100%; height:1px; line-height: 3px;"><hr /></td></tr>
  <tr>
  <td rowspan="2" style="width: 20%;"><barcode codetype="code128" showtext="true" value="${record.tranid}"/></td>
  <td colspan="2" rowspan="1" style="width: 70%;"><span class="synh9"><strong>BANKING DETAILS:</strong> Bank, Account No: 1, Branch Code: 2, SWIFT Addr: 3</span></td>
  <td align="right" rowspan="2" style="width: 10%;"><pagenumber/> of <totalpages/></td>
  </tr>
  <tr>
  <td rowspan="1" style="width: 34%; padding: 3px 5px 0px 0px;"><span class="synh11">The debt evidenced by this account has been ceded to the bank. No set off will be recognised. No obligation has been delegated by us and any claim or dispute will remain our responsibility.</span></td>
  <td rowspan="1" style="width: 34%; padding: 3px 0px 0px 5px;"><span class="synh11">All supplies and services of the company shall exclusively be subject to the terms and conditions on our website. On request, we will provide you with a copy of the terms and conditions.</span></td>
  </tr></table>