Our document layout engine uses HTML and CSS code to generate documents, giving you lots of power and flexibility in layout and style. When you download to PDF, we use some software to convert your HTML to a PDF.
There are some best practices for Document layouts, and we'll list them here and explain why this is the case:
Coding tags
To strengthen our security, specific code tags will not be rendered by the system. The development team will ensure new documents do not include these code tags and will stop rendering them on old documents starting September 2025.
To align with this change, please go through your documents and remove the following tags:
<script>
<form>
<iframe>
<object>
And the following HTML attributes:
onClick=
onLoad=
onError=
IP Addresses
We will disallow IP addresses from being pointed to any image hosted elsewhere to prevent the IP address from being targeted or attacked, similar to document tags. If you host your images, please contact customer support.
Custom font kerning and spacing issues
Since Current RMS is a web application, fonts used in your documents must be web fonts. Google Fonts is a great source of web fonts.
Our PDF rendering software doesn’t always work correctly with web fonts and you might notice issues with font kerning or spacing.
Here’s an example of Open Sans notice the letter spacing and kerning:
Here’s an example of Quicksand, notice that h , n , m , and o letters are somewhat clipped:
We’ve investigated this and we’re not too sure what the cause is. Adjusting kerning or letter spacing in CSS doesn’t make a difference. The problem likely lies with a third-party component used by our PDF rendering software.
Before selecting a font, we recommend testing fonts by adding them to a document and previewing to PDF.
Fixing the content to the bottom of the body section
If you’re used to creating quotations or invoices in word processors, it’s fairly straightforward to float content to the bottom of the page. This is because you’re working with known content, so you can position things exactly where you like.
Documents use dynamically generated content, so the information on them might fit on one page or might span multiple pages.
For this reason, there’s no way to float content to the bottom of the body section.
Remember the header and footer are repeated on each page, so you can include information like page numbers at the bottom of each page – it’s just floating content to the bottom of one particular page that’s a problem.
Different headers and footers on different pages
All documents in Current RMS are made up of header, body, and footer content.
Header
Code here appears above the top margin of the document and is repeated on each page when printed to PDF.Body
Code here is placed between the margins of the document. This is where your main content should go.Footer
Code here appears below the bottom margin of the document and is repeated on each page when printed to PDF.
The header and footer content will repeat on every page. There’s no way to prevent this from happening, so it’s worth bearing in mind if you’re looking to build cover pages or would like documents with different headers across pages.
Keep in mind that PDFs that are attached to document layouts and merged during PDF generation will not include the header or footer.
HTML and CSS properties which are not supported
CSS flexbox
CSS columns
CSS animations (of course!)
Embedded content like maps or iframes
Target the browser preview
The body of the document layout preview in the browser has an ID of print_preview , meaning you can create styles that only target the browser preview and not the PDF. This is handy if you use document approval more often than not.
For example, to set a custom font to show in the preview but not the PDF, you might use:
body#print_preview {
font-family: "Open Sans", sans-serif;
}The PDF doesn’t have a body ID of print_preview, so it’ll be safely ignored.
Remember, you may use the :not() selector to apply styles when a condition isn’t matched. For example, to set the text colour to red in the PDF but not the preview, you might use:
body:not(#print_preview) {
color: red;
}