layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-1-ref.xhtml@fc2d59ddac77
layout/reftests/w3c-css/submitted/flexbox/flexbox-align-content-vert-1-ref.xhtml
Wed, 31 Dec 2014 07:22:50 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 07:22:50 +0100
- branch
- TOR_BUG_3246
- changeset 4
- fc2d59ddac77
- permissions
- -rw-r--r--
Correct previous dual key logic pending first delivery installment.
1 <?xml version="1.0" encoding="UTF-8"?>
2 <!--
3 Any copyright is dedicated to the Public Domain.
4 http://creativecommons.org/publicdomain/zero/1.0/
5 -->
6 <html xmlns="http://www.w3.org/1999/xhtml">
7 <head>
8 <title>CSS Reftest Reference</title>
9 <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"/>
10 <style>
11 div.flexbox {
12 width: 200px;
13 margin-bottom: 2px;
14 background: lightgray;
15 height: 20px;
16 clear: all;
17 }
18 div.a {
19 width: 10px;
20 height: 20px;
21 background: lightgreen;
22 float: left;
23 }
24 div.b {
25 width: 30px;
26 height: 20px;
27 background: pink;
28 float: left;
29 }
30 div.c {
31 width: 40px;
32 height: 20px;
33 background: orange;
34 float: left;
35 }
37 /* Inside of 'b': */
38 div.fixedSizeChild {
39 width: 30px;
40 height: 10px;
41 background: purple;
42 }
43 </style>
44 </head>
45 <body>
47 <!-- default (stretch) -->
48 <div class="flexbox">
49 <div class="a"/>
50 </div>
51 <div class="flexbox">
52 <div class="a"/>
53 <div class="b" style="margin-left:80px; width:110px"><div class="fixedSizeChild"/></div>
54 </div>
55 <div class="flexbox">
56 <div class="a"/>
57 <div class="b" style="margin-left: 40px; width: 70px"><div class="fixedSizeChild"/></div>
58 <div class="c"/>
59 </div>
61 <!-- flex-start -->
62 <div class="flexbox">
63 <div class="a"/>
64 </div>
65 <div class="flexbox">
66 <div class="a"/>
67 <div class="b"><div class="fixedSizeChild"/></div>
68 </div>
69 <div class="flexbox">
70 <div class="a"/>
71 <div class="b"><div class="fixedSizeChild"/></div>
72 <div class="c"/>
73 </div>
75 <!-- flex-end -->
76 <div class="flexbox">
77 <div class="a"/>
78 </div>
79 <div class="flexbox">
80 <div class="a" style="margin-left: 160px"/>
81 <div class="b"><div class="fixedSizeChild"/></div>
82 </div>
83 <div class="flexbox">
84 <div class="a" style="margin-left: 120px"/>
85 <div class="b"><div class="fixedSizeChild"/></div>
86 <div class="c"/>
87 </div>
89 <!-- center -->
90 <div class="flexbox">
91 <div class="a"/>
92 </div>
93 <div class="flexbox">
94 <div class="a" style="margin-left: 80px"/>
95 <div class="b"><div class="fixedSizeChild"/></div>
96 </div>
97 <div class="flexbox">
98 <div class="a" style="margin-left: 60px"/>
99 <div class="b"><div class="fixedSizeChild"/></div>
100 <div class="c"/>
101 </div>
103 <!-- space-between -->
104 <div class="flexbox">
105 <div class="a"/>
106 </div>
107 <div class="flexbox">
108 <div class="a"/>
109 <div class="b" style="margin-left: 160px"><div class="fixedSizeChild"/></div>
110 </div>
111 <div class="flexbox">
112 <div class="a"/>
113 <div class="b" style="margin-left: 60px"><div class="fixedSizeChild"/></div>
114 <div class="c" style="margin-left: 60px"/>
115 </div>
117 <!-- space-around -->
118 <div class="flexbox">
119 <div class="a"/>
120 </div>
121 <div class="flexbox">
122 <div class="a" style="margin-left: 40px"/>
123 <div class="b" style="margin-left: 80px"><div class="fixedSizeChild"/></div>
124 </div>
125 <div class="flexbox">
126 <div class="a" style="margin-left: 20px"/>
127 <div class="b" style="margin-left: 40px"><div class="fixedSizeChild"/></div>
128 <div class="c" style="margin-left: 40px"/>
129 </div>
131 </body>
132 </html>
