page-margin-005-print.html (769B)
1 <!DOCTYPE html> 2 <title>Percentage-based @page margins should resolve against the correct dimension</title> 3 <link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org"> 4 <link rel="help" href="https://www.w3.org/TR/css-page-3/#page-properties"> 5 <link rel="match" href="page-margin-005-print-ref.html"> 6 <style> 7 @page { 8 size: 600px 300px; 9 margin: 10% 5%; 10 } 11 :root { 12 print-color-adjust: exact; 13 } 14 body { 15 margin: 0; 16 background: cyan; 17 } 18 </style> 19 The page margins should be the same on every side (30px).<br> 20 There's a 30px square in the bottom right corner. 21 <div style="position:fixed; right:0; bottom:0; width:30px; height:30px; background:hotpink;"></div> 22 <div style="break-before:page;"> 23 Same on the second page. 24 </div>