search

delight-im / HTML-Sheets-of-Paper

Word processor in your browser using HTML and CSS (for invoices, legal notices, etc.)
https://delight-im.github.io/HTML-Sheets-of-Paper/
MIT License
1.22k stars 142 forks source link

Consider adding dynamic page numbers #17

Open ocram opened 2 years ago

ocram commented 2 years ago 
html, body {
    counter-reset: hsop-page-number;
}
.page {
    position: relative;
}
.page::after {
    position: absolute;
    bottom: 10mm;
    left: 0;
    width: 100%;
    display: inline-block;
    counter-increment: hsop-page-number;
    content: "Page " counter(hsop-page-number);
    font-size: 8pt;
    text-align: center;
}
raduchiriac commented 1 year ago

@ocram I might be wrong but after many trial and error this is will not work in @media print. The text goes into the text. Some height + position:relative related issues maybe?

image