layout/reftests/w3c-css/submitted/flexbox/flexbox-overflow-vert-2-ref.html

branch
TOR_BUG_9701
changeset 11
deefc01c0e14
equal deleted inserted replaced
-1:000000000000 0:3ba56c25db02
1 <!DOCTYPE html>
2 <!--
3 Any copyright is dedicated to the Public Domain.
4 http://creativecommons.org/publicdomain/zero/1.0/
5 -->
6 <html>
7 <head>
8 <title>CSS Reftest Reference</title>
9 <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
10 <style>
11 .flexContainer {
12 background: purple;
13 display: flex;
14 flex-direction: column;
15 align-items: center;
16 width: 70px;
17 height: 70px;
18 margin-bottom: 5px;
19 }
20 .bigItem {
21 background: blue;
22 width: 10px;
23 /* Tall border (taller than our container): */
24 border: solid coral;
25 border-width: 2px 50px;
26 flex: 3;
27 }
28 .smallItem {
29 background: teal;
30 width: 20px;
31 flex: 1;
32 }
33 .hidden > .bigItem {
34 /* To match the testcase's "overflow:hidden"-cropped flex item, we
35 just use a smaller border that exactly fits our container (and
36 doesn't overflow). */
37 border-width: 2px 30px;
38 }
39 </style>
40 </head>
41 <body>
42 <div class="flexContainer"><!-- (overflow un-set) -->
43 <div class="bigItem"></div>
44 <div class="smallItem"></div>
45 </div>
46 <div class="flexContainer hidden">
47 <div class="bigItem"></div>
48 <div class="smallItem"></div>
49 </div>
50 </body>
51 </html>

mercurial