CSS 在 Netsuite 高级 PDF 模板中为表头的一部分添加字母之间的额外间距

Question

我有一个 html 表格，其中包含 Netsuite 高级 PDF 模板中的表格标题。由于某种原因，标题之一的单词在字母之间有额外的间距，因此不要打印

Delivery
Address

打印的标题

D e l i v e r y
Address

地址部分没有多余的空格。

标题的代码是:

<table class="itemtable" style="width: 100%;"><!-- start items --><#list record.item as item><#if item_index==0>
<thead>
  <tr>
    <th colspan="3">Delivery Address</th>

我研究过诸如word-break、letter-spacing等CSS属性；但我找不到任何似乎适合解决这个问题的东西。

有人知道为什么会发生这种情况吗？在具有相同代码的 html 页面中不会发生这种情况，因此不确定为什么在 Netsuite 中会发生这种情况。

CSS 是:

  table {
     font-size: 9pt;
     table-layout: fixed;
  }
  th {
      font-weight: bold;
      font-size: 8pt;
      vertical-align: middle;
      padding: 5px 6px 3px;
      background-color: #e3e3e3;
      color: #333333;
  }
  td {
      padding: 4px 6px;
  }
  td p { align:left }
  b {
      font-weight: bold;
      color: #333333;
  }
  table.header td {
      padding: 0;
      font-size: 10pt;
  }
  table.footer td {
      padding: 0;
      font-size: 8pt;
  }
  table.itemtable th {
      padding-bottom: 10px;
      padding-top: 10px;
  }
  table.body td {
      padding-top: 2px;
  }
  table.total {
      page-break-inside: avoid;
  }
  tr.totalrow {
      background-color: #e3e3e3;
      line-height: 200%;
  }
  td.totalboxtop {
      font-size: 12pt;
      background-color: #e3e3e3;
  }
  td.addressheader {
      font-size: 8pt;
      padding-top: 6px;
      padding-bottom: 2px;
  }
  td.address {
      padding-top: 0;
  }
  td.totalboxmid {
      font-size: 28pt;
      padding-top: 20px;
      background-color: #e3e3e3;
  }
  td.totalboxbot {
      background-color: #e3e3e3;
      font-weight: bold;
  }
  span.title {
      font-size: 28pt;
  }
  span.number {
      font-size: 16pt;
  }
  span.itemname {
      font-weight: bold;
      line-height: 150%;
  }
  hr {
      width: 100%;
      color: #d3d3d3;
      background-color: #d3d3d3;
      height: 1px;
  }
  .synb {
      font-weight: bold;
  }
  .synh7 {
      font-size: 10pt;
      line-height: 120%;
  }
  .synh9 {
      font-size: 8pt;
      line-height: 120%;
  }
  tr.synbordertop td {
      border-top: 1pt solid black;
  }
  span.syntitle {
      font-size: 20pt;
  }
  span.synnumber {
      font-size: 13pt;
  }

Answer 1

编辑:Netsuite 对这些 PDF 使用 BFO。请参阅以下有关此特定问题的内容:https://bfo.com/support/faq/#31

How can I stop the letters in my table from being stretched out?
By default the text in tables is justified. In order to prevent this you need to set align="left". Remember that each element has a <p> implicitly placed around the data, so the best way to achieve this is to use a style sheet and add:

td p { align:left }

which will cause all the table data elements to align to the left.

我以前也遇到过同样的问题。这似乎是 Netsuite 的 PDF 渲染独有的问题。

这是我实现的修复它的代码:

Netsuite/HTML

 <th><p style="align: center;">Color</p></th> 

CSS:

  td {
        text-align: left;
        padding: 2px;
}
      th {
        padding: 2px;
      }

这是没有中心对齐的情况:

这是中心的样子:

我确信这不是最理想的情况，但这是我能够让它发挥作用的唯一方法，我确信我尝试了许多与您所做的相同的事情。

我使用此链接中的信息作为进一步引用:

"This article is relevant if you are working with NetSuite Advanced PDF Templates, and you are encountering an unusual HTML table cell alignment effect in the generated PDF."

http://blog.prolecto.com/2016/03/18/netsuite-advanced-pdf-templates-how-to-fix-table-cell-alignment-justification-anomaly/

希望这有帮助，这至少是我遇到类似问题时实现的解决方案。