layout/reftests/w3c-css/submitted/flexbox/flexbox-align-self-baseline-horiz-3-ref.xhtml@141e0f1194b1
layout/reftests/w3c-css/submitted/flexbox/flexbox-align-self-baseline-horiz-3-ref.xhtml
Wed, 31 Dec 2014 07:16:47 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 07:16:47 +0100
- branch
- TOR_BUG_9701
- changeset 3
- 141e0f1194b1
- permissions
- -rw-r--r--
Revert simplistic fix pending revisit of Mozilla integration attempt.
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 .flexbox {
12 width: 40px;
13 height: 40px;
14 border: 1px solid gray;
15 margin: 5px; /* just for visual separation */
16 float: left;
17 }
19 .flexbox > * {
20 background: yellow;
21 border: 1px solid black;
22 height: 20px;
23 }
24 </style>
25 </head>
26 <body>
27 <!-- ZEROTH ROW: NO MARGINS -->
28 <!-- No margins on flex item: -->
29 <div class="flexbox">
30 <div style="margin-top: 18px">a</div>
31 </div>
34 <!-- FIRST ROW: SETTING MARGIN-TOP: -->
35 <br style="clear: both"/>
37 <!-- auto: -->
38 <div class="flexbox">
39 <div style="margin-top: 18px">a</div>
40 </div>
42 <!-- Negative: -->
43 <div class="flexbox">
44 <div style="margin-top: 18px">a</div>
45 </div>
47 <!-- Small: -->
48 <div class="flexbox">
49 <div style="margin-top: 18px">a</div>
50 </div>
52 <!-- Large (pushing us out of container): -->
53 <div class="flexbox">
54 <div style="margin-top: 18px">a</div>
55 </div>
58 <!-- SECOND ROW: SETTING MARGIN-BOTTOM: -->
59 <br style="clear: both"/>
61 <!-- auto: -->
62 <div class="flexbox">
63 <div>a</div>
64 </div>
66 <!-- Negative: -->
67 <div class="flexbox">
68 <div style="margin-top: 22px">a</div>
69 </div>
71 <!-- Small: -->
72 <div class="flexbox">
73 <div style="margin-top: 14px">a</div>
74 </div>
76 <!-- Large: -->
77 <div class="flexbox">
78 <div style="margin-top: -7px">a</div>
79 </div>
81 </body>
82 </html>
