testing/web-platform/tests/css/css-page/page-box-009-print.html
author Sotaro Ikeda <sotaro.ikeda.g@gmail.com>
Thu, 10 Jul 2025 00:10:09 +0000 (6 hours ago)
changeset 795941 23763b72c35abeead04f63e4503c28abc73d065d
parent 782105 f2ea3ae402ea8bfbc7665d9f336738763653f837
permissions -rw-r--r--
Bug 1976135 - Remove nightly only limitation of pref gfx.webrender.layer-compositor r=gfx-reviewers,gw Differential Revision: https://phabricator.services.mozilla.com/D256379
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-page-3/#page-properties">
<link rel="match" href="page-box-009-print-ref.html">
<meta name="assert" content="Test percentage-based @page margin/padding, orthogonal writing mode">
<style>
  @page {
    writing-mode: vertical-rl;
    size: 400px 800px;
    margin-inline-start: 2%;
    margin-block-start: 8%;
    margin-inline-end: 6%;
    margin-block-end: 20%;
    padding-inline-start: 2%;
    padding-block-start: 8%;
    padding-inline-end: 6%;
    padding-block-end: 20%;
    background: blue;
  }
  :root {
    print-color-adjust: exact;
  }
  body {
    margin: 0;
    background: hotpink;
  }
</style>
<div style="box-sizing:border-box; padding:4px; height:100vh; background:yellow;">
  This document should be in horizontal-tb writing mode.<br>
  The page padding (in hotpink) and margins (in blue) should be identical.  They
  should be smallest at the top, larger at the right, even larger at the bottom,
  and largest at the left.
</div>