layout/reftests/flexbox/pagination/flexbox-empty-1d.html@97036ab72558
layout/reftests/flexbox/pagination/flexbox-empty-1d.html
Tue, 06 Jan 2015 21:39:09 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Tue, 06 Jan 2015 21:39:09 +0100
- branch
- TOR_BUG_9701
- changeset 8
- 97036ab72558
- permissions
- -rw-r--r--
Conditionally force memory storage according to privacy.thirdparty.isolate;
This solves Tor bug #9701, complying with disk avoidance documented in
https://www.torproject.org/projects/torbrowser/design/#disk-avoidance.
1 <!DOCTYPE html>
2 <!-- Any copyright is dedicated to the Public Domain.
3 http://creativecommons.org/publicdomain/zero/1.0/ -->
4 <!-- Testcase for how we fragment an empty fixed-height flex container, with
5 various combinations of margin/border/padding helping it to be too tall,
6 and with the flex container having "flex-direction: column-reverse".
7 -->
8 <html>
9 <head>
10 <style>
11 .multicol {
12 height: 10px;
13 width: 100px;
14 -moz-column-width: 20px;
15 -moz-column-fill: auto;
16 border: 2px solid orange;
17 }
18 .flexContainer {
19 display: flex;
20 flex-direction: column-reverse;
21 background: teal;
22 /* border-width is 0 by default; some sub-testcases will increase it. */
23 border: 0 dashed black;
24 }
25 </style>
26 </head>
27 <body>
28 <!-- NO BORDERS/PADDING -->
29 <!-- ================== -->
30 <!-- content fits exactly into 1 column: -->
31 <div class="multicol">
32 <div class="flexContainer" style="height: 10px"></div>
33 </div>
35 <!-- content fits, but margin-top pushes it to overflow: -->
36 <div class="multicol">
37 <div class="flexContainer" style="height: 9px;
38 margin-top: 2px;"></div>
39 </div>
41 <!-- content is too tall, by 1px: -->
42 <div class="multicol">
43 <div class="flexContainer" style="height: 11px"></div>
44 </div>
46 <!-- BORDERS/PADDING ON TOP -->
47 <!-- ====================== -->
48 <!-- content fits, but border-top makes us too tall: -->
49 <div class="multicol">
50 <div class="flexContainer" style="height: 9px;
51 border-top-width: 2px"></div>
52 </div>
54 <!-- content fits, but padding-top makes us too tall: -->
55 <div class="multicol">
56 <div class="flexContainer" style="height: 9px;
57 padding-top: 2px"></div>
58 </div>
60 <!-- content fits, but border/padding-top make us too tall: -->
61 <div class="multicol">
62 <div class="flexContainer" style="height: 9px;
63 border-top-width: 1px;
64 padding-top: 1px"></div>
65 </div>
67 <!-- BORDERS/PADDING ON BOTTOM -->
68 <!-- ========================= -->
69 <!-- content fits, but border-bottom-width makes us too tall: -->
70 <div class="multicol">
71 <div class="flexContainer" style="height: 9px;
72 border-bottom-width: 2px"></div>
73 </div>
75 <!-- content fits, but padding-bottom makes us too tall: -->
76 <div class="multicol">
77 <div class="flexContainer" style="height: 9px;
78 padding-bottom: 2px"></div>
79 </div>
81 <!-- content fits, but border/padding-bottom make us too tall: -->
82 <div class="multicol">
83 <div class="flexContainer" style="height: 9px;
84 border-bottom-width: 1px;
85 padding-bottom: 1px"></div>
86 </div>
88 <!-- BORDERS/PADDING ON TOP AND BOTTOM -->
89 <!-- ================================= -->
90 <!-- content fits, but border-top/bottom combined make us too tall: -->
91 <div class="multicol">
92 <div class="flexContainer" style="height: 9px;
93 border-top-width: 1px;
94 border-bottom-width: 1px"></div>
95 </div>
97 <!-- content fits, but padding-top/bottom combined make us too tall: -->
98 <div class="multicol">
99 <div class="flexContainer" style="height: 9px;
100 padding-top: 1px;
101 padding-bottom: 1px"></div>
102 </div>
104 </body>
105 </html>
