csscounthtml

print page count with total number of pages using css


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);
    }

Solution

  • Did you try this:

    @page {
       @bottom-right {
        content: counter(page) " of " counter(pages);
       }
    }