I am struggling to display the page number at the bottom of my printable document. I followed a source on Stack Overflow, but unfortunately, it did not work for me.
My current CSS attempt to achieve this is as follows:
body {
text-align: justify;
}
/* class to break into new page */
.pagebreak { page-break-before: always; }
@media print {
body {
font-size: 18px;
}
@bottom-right {
content: "Page " counter(page) " of " counter(pages);
}
Despite implementing this code, when I try to print the document, the page number does not appear at all.
What am I doing wrong in my CSS? How can I successfully display the page numbers?
Thank you.
Edited
After researching further, I have discovered that most major browsers do not support the @bottom-right property. Any suggestions on how to overcome this limitation?