title: CSS Polyfill to make "page-break-after: avoid" and "target-counter" work?
body: <p>Does anyone know of a css polyfill that makes it possible to make use of <code>page-break-after: avoid</code> and target-counter, for example like this:</p>
  
  <pre><code>.myDiv a::after {
    content: leader(".") target-counter(attr(href), page, decimal)
  }
  </code></pre>
  
  <p>The leader is not absolutely necessary (but would be nice).</p>
  
  <p>The use case for <code>the page-break-after: avoid</code> is that I want to avoid ever breaking a page right after a heading, and make sure at least the first paragraph (which for the record has <code>page-break-inside: avoid</code>) gets on the same page as the heading.</p>
  
  <p>I want to use the target-counter so that I am able to generate table of contents for my PDFs using puppeteer. (I saw <a href="https://www.pagedmedia.org/paged-js/" rel="nofollow noreferrer">Paged.JS</a> use this in their example, and they had it working, so I'm guessing they created some sort of a polyfill themselves)</p>