Question

我有一个下表，该表的布局很好，中间一栏是页面的70％。但是，当我取消注释前两个表行时，它会使布局混乱，中间的列仅显示页面的50％。同样，水平尺和“ Received by：”行将忽略任何高度和线高的变化。这是NetSuite Advanced 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>

NetSuite Advanced PDF模板CSS和HTML在添加其他表行时忽略高度并弄乱了布局

1 个答案: