layout/reftests/w3c-css/submitted/flexbox/flexbox-baseline-multi-line-vert-2-ref.html@7540298fafa1
layout/reftests/w3c-css/submitted/flexbox/flexbox-baseline-multi-line-vert-2-ref.html
Thu, 15 Jan 2015 21:13:52 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Thu, 15 Jan 2015 21:13:52 +0100
- branch
- TOR_BUG_9701
- changeset 12
- 7540298fafa1
- permissions
- -rw-r--r--
Remove forgotten relic of ABI crash risk averse overloaded method change.
1 <!DOCTYPE html>
2 <!--
3 Any copyright is dedicated to the Public Domain.
4 http://creativecommons.org/publicdomain/zero/1.0/
5 -->
6 <!-- Reference case, using inline-block instead of inline-flex, and with the
7 baseline-aligned items aligned using specific font-size / line-heights,
8 and with unaligned children taken out of baseline-alignment using
9 "float: left".
10 -->
11 <html>
12 <head>
13 <title>CSS Reftest Reference</title>
14 <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
15 <meta charset="utf-8">
16 <style>
17 .flexContainer {
18 display: inline-block;
19 /* Split testcase's 40px width into 20px of padding-left and 20px of
20 width, to set aside space for the testcase's (invisible) second line
21 (which is to the left of the first line, since this is wrap-reverse)
22 */
23 width: 20px;
24 padding-left: 20px;
25 height: 40px;
26 background: lightblue;
27 }
28 .flexContainer > * {
29 width: 20px;
30 height: 20px;
31 display: inline-block;
32 }
34 .smallFont {
35 font-size: 8px;
36 line-height: 8px;
37 }
38 .medFont {
39 font-size: 12px;
40 line-height: 12px;
41 }
42 .bigFont {
43 font-size: 16px;
44 line-height: 16px;
45 }
46 .unaligned { float: left }
47 </style>
48 </head>
49 <body>
50 a
51 <!-- Flex containers with flex items that have a mix of baselines: -->
52 <div class="flexContainer medFont">
53 <div class="medFont">b</div
54 ><br><div class="bigFont unaligned">c</div>
55 </div>
57 <div class="flexContainer bigFont">
58 <div class="bigFont">f</div
59 ><br><div class="smallFont unaligned">g</div>
60 </div>
62 <!-- Flex container with second line baseline-aligned
63 (shouldn't make a difference) -->
64 <div class="flexContainer smallFont">
65 <div class="smallFont">j</div
66 ><br><div class="bigFont unaligned">k</div>
67 </div>
68 n
70 </body>
71 </html>
