8

I have a table which populated with dynamic data and to handle that in printing i have applied some page breaks to it everything works fine but i need to show a pagination like "Page 1 of 3" and so on below every page while printing. I have tried with css but i can only print the current page number with it. is there any other way of achieving it ?? here is my code

   body {
        counter-reset: page;
    }
    .page-count:after {
        counter-increment: page;
        content: "Page " counter(page) " of " counter(pages);
    }
yaser
  • 141
  • 1
  • 2
  • 9

1 Answers1

10

Did you try this:

@page {
   @bottom-right {
    content: counter(page) " of " counter(pages);
   }
}
Edmar Miyake
  • 11,461
  • 3
  • 34
  • 38
  • 6
    Do you know any Browser that supports this at the moment? I tested Chrome and Firefox, however without results. Or is this solution only possible with special user-agents e.g. Prince? – Thomas Fankhauser Sep 12 '17 at 09:13
  • 1
    I'm using `Weasyprint` to generate a pdf table from my django app and this worked. Thanks. I rendered the same table in `Chrome` to see if the page numbers show up, but `Chrome` won't even paginate the output. So I can't say for sure if it works for browsers. But it does work for me with `WeasyPrint==0.42.2` – chidimo Feb 26 '18 at 08:07
  • This is working for me too Weasyprint. But one question. Is there a way to for the 1st page (title page) to not have the page number and for the page numbering to start at 1 on physical page 2? – Brad Rhoads Jun 05 '18 at 18:13
  • 9
    Doesn't work in any of the major broswers as of now. :) – gfels Aug 30 '19 at 15:35