Forum How do I...?

Counter-Reset without generating page break


We have a use-case where we want to reset the page counter if a HTML element in the content of the document is found. The problem is that we don't want to generate a page break when the counter-reset is performed. Does Price support something similar directly from CSS without falling back to some javascript implementation ?

I've tried to break-before:avoid for counter resetting html element as well as break-after:avoid on the preceding html element, including a combination of both but the counter-reseting element is rendered on a new page.

Thanks in advance.

Example CSS:
/* This section always precedes level1 checklist */
.arc-unit[data-unit-family='tocable'][data-ordinal-level='section'] {
    break-after: avoid

.arc-unit[data-unit-family='tocable'][data-ordinal-level='level1'][data-subtype='checklist'] {
    break-before: avoid

.arc-unit[data-unit-family='tocable'][data-ordinal-level='level1'][data-subtype='checklist'] {
    counter-reset: page 1 pages 1
Do you have a forced page break later that you could take advantage of? Prince cannot reset the page counter in situations with only unforced breaks.
Hi Mike,

I didn't quite get your meaning.

Are you saying that when counter-reset is used, Prince automatically inserts the page break to start the page with the element that has defined the counter reset or that there must be a page break on that page for the counter reset to work?

Our problem is that we would like to reset the page counter if 'checklist' element is encountered in the flow of the document but naturally break pages as if the counter-rest wasn't there.
There's also a scenario where there are 2 or more such 'checklists' on the same pdf page that should reset the counter on that page to 1, but keep them on the same page in the natural flow.

Sorry for the confusion.
Prince will automatically insert a page break when the page counter is reset, yes. So it will be necessary to have a forced page break somewhere. In theory you could use JavaScript to determine where the natural page break occurs and then re-run Prince and put a forced page break at that location, but even that would be difficult if the natural break occurs halfway through a paragraph. In general it is not supported to change the page number after a natural page break.

However, another possibility would be to leave the page number unchanged, then use a prince-script() function whenever you access the page number and use JavaScript to keep track of which page it should change on. This means instead of referring to counter(page) you refer to prince-script(mypage, counter(page)) or similar, and it looks up the page number in a list it saved earlier and decides what it should be. This is basically implementing counter-reset yourself, which gives you more flexibility but requires more scripting work.