content-004-print.html (886B)
1 <!DOCTYPE html> 2 <link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org"> 3 <link rel="help" href="https://drafts.csswg.org/css-page-3/#page-based-counters"> 4 <meta name="assert" content="Test counter(page) and counter(pages) in page margin boxes"> 5 <link rel="match" href="content-004-print-ref.html"> 6 <style> 7 @page { 8 margin: 4em; 9 10 @top-center { 11 text-align: left; 12 vertical-align: top; 13 content: "Page " counter(page) " of " counter(pages); 14 } 15 @bottom-center { 16 text-align: left; 17 vertical-align: top; 18 content: "Page " counter(page) " of " counter(pages); 19 } 20 } 21 body { 22 margin: 0; 23 } 24 </style> 25 Every page should display the current page and the total page count in both the 26 header and footer. 27 <div style="break-before:page;"> 28 Another page 29 </div> 30 <div style="break-before:page;"> 31 Yet another page 32 </div>