# Long tables and pagination

Let long tables flow across sheets, keep short blocks together, and choose where a new section starts.

As you build a layout, you may want some content to flow continuously, a block to stay together, or a new part to start on its own sheet. Tembuilder lets you combine these approaches within the same template.

Set the pagination behavior for each section in **Config → Page breaks**. This guide covers those options, long tables, and CSS rules that can affect page breaks.

## 1. Open a section’s page-break settings

Select the section in **Structure**, then open **Config → Page breaks**. There are two controls:

- **Keep together**: whether the section can split across PDF sheets.
- **Page break**: whether to force a break before or after the section.

The controls are independent. A section can start on a new sheet and still continue across several sheets when its content is long.

For a table or list with a variable number of rows, start with **Keep together: Off** and **Page break: None** to let the content flow.

<figure class="doc-sim pagination-illustration" aria-label="Structure → Section → Config → Page breaks">
<div class="sim-stage"><div class="pg-path">Structure <span>→</span> Invoice Items <span>→</span> Config</div><div class="sim-panel pg-editor"><div class="pg-structure"><div class="sim-panel-title">STRUCTURE</div><div class="sim-tree-row">⌄ Invoice</div><div class="sim-tree-child sim-muted">Billing Parties</div><div class="sim-tree-child sim-selected">Invoice Items</div><div class="sim-tree-child sim-muted">Settlement</div></div><div class="pg-config"><div class="sim-tabs"><span>HTML</span><span>CSS</span><span>Props</span><span class="sim-active sim-focus">Config</span></div><div class="pg-config-card"><strong>Page breaks</strong><div class="pg-setting"><span>Keep together</span><div class="pg-options"><span class="pg-option pg-active">Off</span><span class="pg-option">On</span></div></div><div class="pg-setting"><span>Page break</span><div class="pg-options"><span class="pg-option pg-active">None</span><span class="pg-option">Before</span><span class="pg-option">After</span><span class="pg-option">Both</span></div></div></div></div></div></div>
<figcaption>Structure → Section → Config → Page breaks</figcaption>
</figure>

## 2. Keep a content block together

Use **Keep together: On** for a short section that should stay intact, such as a signature, payment details, or a summary. If the remaining space is too small, the section moves to the next sheet.

Use **Off** for a long table or list that needs to continue across sheets. Keeping the whole table together can leave a large gap on the preceding sheet.

The setting applies to the **whole section**. To keep only the signature together, make it a separate section rather than enabling On for a section containing the entire service table.

<figure class="doc-sim pagination-illustration" aria-label="On → move the signature section together onto the next sheet">
<div class="sim-stage"><div class="pg-keep-setting sim-panel"><strong>Keep together</strong><div class="pg-options"><span class="pg-option">Off</span><span class="pg-option pg-active sim-focus">On</span></div></div><div class="pg-comparison"><div><small>Off</small><div class="pg-mini-pair"><div class="pg-sheet"><div class="pg-lines"><i></i><i></i><i></i></div><div class="pg-signature pg-signature-first">APPROVAL</div><small class="pg-sheet-number">1</small></div><div class="pg-sheet"><div class="pg-signature pg-signature-rest"><i></i><span>Signature</span></div><small class="pg-sheet-number">2</small></div></div></div><div><small>On</small><div class="pg-mini-pair"><div class="pg-sheet"><div class="pg-lines"><i></i><i></i><i></i></div><small class="pg-sheet-number">1</small></div><div class="pg-sheet"><div class="pg-signature">APPROVAL<i></i><span>Signature</span></div><small class="pg-sheet-number">2</small></div></div></div></div></div>
<figcaption>On → move the signature section together onto the next sheet</figcaption>
</figure>

## 3. Choose where a new section starts

Use **Page break** to separate document parts, such as starting the terms on a new sheet after an invoice.

| Option | Behavior |
| --- | --- |
| **None** | Do not force a break before or after the section. |
| **Before** | Start this section on a new sheet when content precedes it. |
| **After** | Start the next section on a new sheet. |
| **Both** | Break before and after the section when content exists on both sides. |

**Both** does not limit the section to one sheet. **Keep together** still controls splitting within the section.

A break at an existing page boundary does not add a blank sheet. For example, Before on the first section does not insert a blank sheet before the document.

<figure class="doc-sim pagination-illustration" aria-label="Before → start the section on a new sheet">
<div class="sim-stage"><div class="sim-panel"><div class="pg-break-head"><strong>Page break</strong><div class="pg-options"><span class="pg-option">None</span><span class="pg-option pg-active sim-focus">Before</span><span class="pg-option">After</span><span class="pg-option">Both</span></div></div><div class="pg-break-pages"><div class="pg-sheet"><b class="pg-doc-title">Content</b><div class="pg-lines"><i></i><i></i><i></i></div><div class="pg-lines"><i></i><i></i><i></i></div><small class="pg-sheet-number">1</small></div><span class="pg-arrow" aria-hidden="true">→</span><div class="pg-sheet"><div class="pg-new-section"><b>Terms</b><div class="pg-lines"><i></i><i></i><i></i></div></div><small class="pg-sheet-number">2</small></div></div></div></div>
<figcaption>Before → start the section on a new sheet</figcaption>
</figure>

## 4. Let long tables continue across sheets

Set **Keep together: Off** on the section containing the table. Use `<thead>` for the header and `<tbody>` for data rows. The `<thead>` header repeats when the table continues onto another sheet.

For service rows, generate table content from `params.lineItems`:

```handlebars
<table>
  <thead>
    <tr><th>Service</th><th>Quantity</th><th>Amount</th></tr>
  </thead>
  <tbody>
    {{#each params.lineItems}}
      <tr>
        <td>{{ description }}</td>
        <td>{{ qty }}</td>
        <td>{{ amount }}</td>
      </tr>
    {{/each}}
  </tbody>
</table>
```

To place totals after the final table row, put them after the table or in the following section with **Page break: None**. To keep the totals intact, enable Keep together on the totals section only.

See [Arrays and objects](/docs/data/arrays-objects/) for more on passing lists into a template.

<figure class="doc-sim pagination-illustration" aria-label="The table continues onto the next sheet with its thead header repeated">
<div class="sim-stage"><div class="pg-table-settings"><span class="sim-badge sim-focus">Keep together: Off</span><span class="sim-badge">Page break: None</span></div><div class="pg-table-pages"><div class="pg-sheet"><div class="pg-table"><div class="pg-table-head"><b>SERVICE</b><b>QTY</b></div><div><span>Service 1</span><span>1</span></div><div><span>Service 2</span><span>1</span></div><div><span>Service 3</span><span>1</span></div><div><span>Service 4</span><span>1</span></div><div><span>Service 5</span><span>1</span></div></div><small class="pg-sheet-number">1</small></div><div class="pg-sheet"><div class="pg-table"><div class="pg-table-head"><b>SERVICE</b><b>QTY</b></div><div><span>Service 6</span><span>1</span></div><div><span>Service 7</span><span>1</span></div><div><span>Service 8</span><span>1</span></div><div><span>Service 9</span><span>1</span></div><div><span>Service 10</span><span>1</span></div></div><small class="pg-sheet-number">2</small></div></div></div>
<figcaption>The table continues onto the next sheet with its thead header repeated</figcaption>
</figure>

## 5. When content is clipped or moves as a block

These symptoms usually point to different settings:

| Symptom | Where to look |
| --- | --- |
| A whole section moves to the next sheet, leaving a large gap | The section’s **Keep together** setting and `break-inside` on its container. |
| Final rows disappear at a container’s edge | The container’s CSS `height`, `max-height`, and `overflow`. |
| A section always starts on a new sheet despite available space | Its **Page break: Before/Both**, After on the preceding section, or CSS `break-before`. |

For example, an `.items` container with a fixed height and `overflow: hidden` clips anything beyond its box. If it should grow with the list, remove the height limit and allow visible content, as illustrated below.

Config controls the section itself. Elements inside it can still have their own CSS break rules, so inspect those if changing Config does not change the result.

<figure class="doc-sim pagination-illustration" aria-label="Section CSS → adjust the container that limits or clips content">
<div class="sim-stage"><div class="sim-panel"><div class="sim-tabs"><span>HTML</span><span class="sim-active">CSS</span><span>Props</span><span>Config</span></div><div class="pg-css-comparison"><div><small>Fixed-height container</small><div class="pg-code"><code>.items {<br />  height: 120px;<br />  overflow: hidden;<br />}</code></div></div><div><small>Content-sized container</small><div class="pg-code sim-focus"><code>.items {<br />  height: auto;<br />  overflow: visible;<br />}</code></div></div></div></div></div>
<figcaption>Section CSS → adjust the container that limits or clips content</figcaption>
</figure>
