layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-3-ref.xhtml@6474c204b198
layout/reftests/w3c-css/submitted/flexbox/flexbox-justify-content-vert-3-ref.xhtml
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rw-r--r--
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
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 body { margin-top: 0px; } /* We'll apply margins w/ style attribute */
12 div.flexbox {
13 height: 200px;
14 margin-right: 2px;
15 float: left;
16 }
17 div.a {
18 width: 20px;
19 height: 35px;
20 background: lightgreen;
21 }
22 div.b {
23 width: 20px;
24 height: 40px;
25 background: pink;
26 }
27 div.c {
28 width: 20px;
29 height: 45px;
30 background: orange;
31 }
32 </style>
33 </head>
34 <body>
36 <!-- default (start) -->
37 <div class="flexbox" style="margin-top: 100px">
38 <div class="a"/>
39 </div>
40 <div class="flexbox" style="margin-top: 100px">
41 <div class="a"/><div class="b"></div>
42 </div>
43 <div class="flexbox" style="margin-top: 100px">
44 <div class="a"/><div class="b"/><div class="c"/>
45 </div>
47 <!-- flex-start -->
48 <div class="flexbox" style="margin-top: 100px">
49 <div class="a"/>
50 </div>
51 <div class="flexbox" style="margin-top: 100px">
52 <div class="a"/><div class="b"/>
53 </div>
54 <div class="flexbox" style="margin-top: 100px">
55 <div class="a"/><div class="b"/><div class="c"/>
56 </div>
58 <!-- flex-end -->
59 <div class="flexbox" style="margin-top: 95px">
60 <div class="a"/>
61 </div>
62 <div class="flexbox" style="margin-top: 55px">
63 <div class="a"/><div class="b"/>
64 </div>
65 <div class="flexbox" style="margin-top: 10px">
66 <div class="a"/><div class="b"/><div class="c"/>
67 </div>
69 <!-- center -->
70 <div class="flexbox" style="margin-top: 97.5px">
71 <div class="a"/>
72 </div>
73 <div class="flexbox" style="margin-top: 77.5px">
74 <div class="a"/><div class="b"/>
75 </div>
76 <div class="flexbox" style="margin-top: 55px">
77 <div class="a"/><div class="b"/><div class="c"/>
78 </div>
80 <!-- space-between -->
81 <div class="flexbox" style="margin-top: 100px">
82 <div class="a"/>
83 </div>
84 <div class="flexbox" style="margin-top: 100px">
85 <div class="a"/><div class="b"/>
86 </div>
87 <div class="flexbox" style="margin-top: 100px">
88 <div class="a"/><div class="b"/><div class="c"/>
89 </div>
91 <!-- space-around -->
92 <div class="flexbox" style="margin-top: 97.5px">
93 <div class="a"/>
94 </div>
95 <div class="flexbox" style="margin-top: 77.5px">
96 <div class="a"/><div class="b"/>
97 </div>
98 <div class="flexbox" style="margin-top: 55px">
99 <div class="a"/><div class="b"/><div class="c"/>
100 </div>
102 </body>
103 </html>
