Skip to content
This repository was archived by the owner on Dec 18, 2018. It is now read-only.

Commit 1abd1b8

Browse files
committed
1 parent cb0aa48 commit 1abd1b8

File tree

3 files changed

+19
-26
lines changed

3 files changed

+19
-26
lines changed

vendor-imports/mozilla/mozilla-central-reftests/flexbox/flexbox-baseline-empty-001-ref.html

Lines changed: 7 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,7 @@
44
http://creativecommons.org/publicdomain/zero/1.0/
55
-->
66
<!-- In this reference case, we have inline-blocks instead of inline
7-
flex containers. We stick an Ahem whitespace character in each
8-
inline-block, with a customized line-height to make the baseline
9-
end up at the bottom of the inline-block's content-box. -->
7+
flex containers. Otherwise it's the same. -->
108
<html>
119
<head>
1210
<title>CSS Reftest Reference</title>
@@ -21,13 +19,6 @@
2119
display: inline-block;
2220
height: 16px;
2321
width: 16px;
24-
/* Each inline-block's baseline will be the baseline of the single Ahem
25-
character that it contains. We want to set up that char such that its
26-
baseline is at the bottom of the container's content box (since that's
27-
the corresponding flex container's baseline). So, we use a line-height
28-
of 20px, which gives us a baseline of 20px * 0.8 = 16px, which is the
29-
bottom of the container's content-box -- awesome. */
30-
line-height: 20px;
3122
background: purple;
3223
border: 0px dotted black;
3324
/* (Elements that want a border will set their border-width.) */
@@ -36,13 +27,11 @@
3627
</head>
3728
<body>
3829
A
39-
<!-- We have to include a character in the inline-blocks in order for them
40-
to baseline-align; otherwise, they align the bottom of their
41-
border-boxes. -->
42-
<div class="flexContainer">&nbsp;</div>
43-
<div class="flexContainer" style="padding-bottom: 20px">&nbsp;</div>
44-
<div class="flexContainer" style="padding: 10px">&nbsp;</div>
45-
<div class="flexContainer" style="border-width: 3px">&nbsp;</div>
46-
<div class="flexContainer" style="border-bottom-width: 4px">&nbsp;</div>
30+
<div class="flexContainer"></div>
31+
<div class="flexContainer" style="padding-bottom: 20px"></div>
32+
<div class="flexContainer" style="padding: 10px"></div>
33+
<div class="flexContainer" style="border-width: 3px"></div>
34+
<div class="flexContainer" style="border-bottom-width: 4px"></div>
35+
<div class="flexContainer" style="border-bottom-width: 4px; margin: 2px"></div>
4736
</body>
4837
</html>

vendor-imports/mozilla/mozilla-central-reftests/flexbox/flexbox-baseline-empty-001a.html

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,12 @@
66
<!-- Testcase for how we compute the baseline of a horizontal flex container
77
with no flex items. This is the main-axis baseline. The spec says this
88
about this case:
9+
https://drafts.csswg.org/css-flexbox/#flex-baselines
10+
"Otherwise, the flex container has no first/last main-axis baseline set,
11+
and one is synthesized if needed according to the rules of its alignment context."
912
10-
The flex container's main-axis baseline is synthesized
11-
from ... the flex container's content box.
12-
13-
I'm taking that to mean the baseline is the bottom of the content box.
13+
The alignment context in this case is inline-level so the margin-box
14+
should be used to synthesize the baseline.
1415
-->
1516
<html>
1617
<head>
@@ -41,5 +42,6 @@
4142
<div class="flexContainer" style="padding: 10px"></div>
4243
<div class="flexContainer" style="border-width: 3px"></div>
4344
<div class="flexContainer" style="border-bottom-width: 4px"></div>
45+
<div class="flexContainer" style="border-bottom-width: 4px; margin: 2px"></div>
4446
</body>
4547
</html>

vendor-imports/mozilla/mozilla-central-reftests/flexbox/flexbox-baseline-empty-001b.html

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,12 @@
66
<!-- Testcase for how we compute the baseline of a vertical flex container
77
with no flex items. This is the cross-axis baseline. The spec says this
88
about this case:
9+
https://drafts.csswg.org/css-flexbox/#flex-baselines
10+
"Otherwise, the flex container has no first/last main-axis baseline set,
11+
and one is synthesized if needed according to the rules of its alignment context."
912
10-
...the flex container's cross-axis baseline is synthesized
11-
from ... the flex container's content box.
12-
13-
I'm taking that to mean the baseline is the bottom of the content box.
13+
The alignment context in this case is inline-level so the margin-box
14+
should be used to synthesize the baseline.
1415
-->
1516
<html>
1617
<head>
@@ -42,5 +43,6 @@
4243
<div class="flexContainer" style="padding: 10px"></div>
4344
<div class="flexContainer" style="border-width: 3px"></div>
4445
<div class="flexContainer" style="border-bottom-width: 4px"></div>
46+
<div class="flexContainer" style="border-bottom-width: 4px; margin: 2px"></div>
4547
</body>
4648
</html>

0 commit comments

Comments
 (0)