page-margin-auto-print-ref.html (928B)
1 <!DOCTYPE html> 2 <link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org"> 3 <style> 4 @page { 5 size: 20em 7em; 6 margin: 0; 7 } 8 :root { 9 print-color-adjust: exact; 10 } 11 .pagebox { 12 break-before: page; 13 display: flex; 14 width: 20em; 15 height: 7em; 16 } 17 .pagebox > div { 18 width: 12em; 19 height: 3em; 20 margin: auto; 21 background: yellow; 22 } 23 body { 24 margin: 0; 25 } 26 </style> 27 <div class="pagebox"> 28 <div>center / middle</div> 29 </div> 30 <div class="pagebox"> 31 <div style="margin-top:0;">center / top</div> 32 </div> 33 <div class="pagebox"> 34 <div style="margin-bottom:0;">center / bottom</div> 35 </div> 36 <div class="pagebox"> 37 <div style="margin-top:0; margin-left:0;">top / left</div> 38 </div> 39 <div class="pagebox"> 40 <div style="margin-top:0; margin-right:0;">top / right</div> 41 </div> 42 <div class="pagebox"> 43 <div style="margin-bottom:0; margin-right:0;">bottom / right</div> 44 </div>