S-Docs Template Development Best Practices

1

Put everything inside basic tables, even headers and footers

Keep all layout and structure within basic HTML tables.

2

Don’t use the same styling as a modern website.

Avoid modern webpage styling; prefer email/template-safe, table-based styles.

3

Standard recommended style statement for a table

Use the following table declaration as the recommended starting point:

Recommended table style

<table border="0" cellpadding=“0” cellspacing="0" style="border-collapse: collapse; border: none; font-family:Arial Unicode MS,sans-serif; font-size: 9pt; width: 100%;">

4

Avoid using elements that have built-in styling

Do not use <p>, <th>, <ul>, <li>, or anything that has built-in browser styling.

5

Only use <span> when necessary

Prefer minimal inline elements; reserve <span> for when it's required.

6

Font-family considerations

Note: Arial Unicode MS sometimes will not show bolded text in Chrome's PDF preview, but it will once the template is downloaded.

7

Avoid using margin

For spacing, prefer table-based techniques:

• For horizontal spacing use:

  Horizontal spacing example

  <tr><td style="line-height:20px;width:100%;">&nbsp;&nbsp;</td></tr>

• Use extra blank columns for side margins.

8

Use percent for column widths

For column widths use percent values instead of px.