diff options
Diffstat (limited to 'layout/base/tests/chrome/printpreview_pps2_ref.html')
| -rw-r--r-- | layout/base/tests/chrome/printpreview_pps2_ref.html | 40 |
1 files changed, 40 insertions, 0 deletions
diff --git a/layout/base/tests/chrome/printpreview_pps2_ref.html b/layout/base/tests/chrome/printpreview_pps2_ref.html new file mode 100644 index 0000000000..b1e8033c87 --- /dev/null +++ b/layout/base/tests/chrome/printpreview_pps2_ref.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<!-- This is a reference case for a "2-pages-per-sheet" scenario. The width and + height of each "swatch" is 0.625 the width and height of the page. That + 0.625 scale-factor comes from the fact that, when rendering the testcase, + we'll need to scale the page-width (8in) down enough to fit side-by-side + into half of the page height (10in/2 = 5in), on a rotated sheet. So we've + got to scale 8in to fit into 5in, which is a scale factor of 0.625. --> +<style> +html { height: 100%; } +body { + height: 100%; + margin: 0; + box-sizing: border-box; + + /* The testcase (rendered at 2-pages-per-sheet) will have 1.75in of extra + space in the vertical axis, which will be distributed equally with 0.875in + on the top and the bottom of the page grid. We mock that up as padding + here: */ + padding: 0.875in 0; + + /* We lay out the body as a row-oriented flex container, with two + side-by-side children which correspond to the two pages per sheet: */ + display: flex; +} +.swatch { + box-sizing: border-box; + + /* This represents the 240px border in the testcase, scaled down 0.625x: */ + border: 150px solid; + + /* Share the width equally among the swatches. (The height will be + automatically set to the flex container's row height, via default + 'align-self' behavior.) */ + flex: 1; +} +.swatch:nth-child(1) { border-color: cyan; } +.swatch:nth-child(2) { border-color: pink; } +</style> +<div class="swatch"></div> +<div class="swatch"></div> |