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

Question

我在 Netsuite 高级 PDF 模板中有一个带有 table 标题的 html table。由于某种原因，其中一个标题的字母之间有额外的间距，所以不用打印

Delivery
Address

对于 header 它打印

D e l i v e r y
Address

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

header 的代码是：

<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>

我查看了 css 属性，例如 word-break、letter-spacing 等；但我找不到任何似乎适合解决这个问题的东西。

有人知道为什么会这样吗？这不会发生在具有相同代码的 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;
      }

这是没有中心对齐的样子：

这是中心的样子：

我确定这不是最理想的情况，但这是我能够让它工作的唯一方法，我确定我尝试了很多与您相同的事情。

我使用此 link 中的信息以供进一步参考：

"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/

希望这会有所帮助，这至少是我在运行遇到类似问题时实施的解决方案。

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

CSS adding additional spacing between letters for part of a table header in a Netsuite advanced PDF Template

css

templates

netsuite