Skip to content

pagedjs
pagedjs
Open
Opened by Mauro@mb21
Report abuse New issue

Merge @page rules from different CSS sources

Having two @page rules in the same CSS file, or in the same <style> element works as expected.

But if you have two non-empty @page rules in two separate elements (or files), the cascade doesn't work.

Minimal repro:

<!DOCTYPE html>
<html>
  <head>
    <style>
    @page {
      size: A4;
    }
    </style>
    <style>
    @page {
      margin-top: 6cm;
    }
    </style>
  </head>
  <body>
    <h1>foo</h1>
    <script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>
  </body>
</html>
  • Expected: the margin-top pushes down the foo header in the layout.
  • Actual: the margin-top is ignored.

Thanks for looking into this! I'm happy to help in any way I can. But looking at the code, I'm uncertain about some of the reasoning that went into it. And I don't want to invest a lot of time in a pull request if you prefer to fix it yourself / your way...