Skip to content

Commit d7fa41f

Browse files
aethanycmoz-wptsync-bot
aethanyc
authored and
moz-wptsync-bot
committed
Add WPTs for abspos under inline element in rtl and vertical writing mode.
Differential Revision: https://phabricator.services.mozilla.com/D301942 bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=489100 gecko-commit: 22bcef891f2df0fed59ea2fba32c116a3f7eda54 gecko-reviewers: dholbert
1 parent a3ae179 commit d7fa41f

4 files changed

Lines changed: 174 additions & 0 deletions

‎css/css-position/position-absolute-in-inline-005-ref.html‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<!DOCTYPE html>
2+
<title>CSS Positioned Reference: Test the inline containing block rectangle for a fragmented inline element</title>
3+
<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
4+
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
5+
<link rel="stylesheet" href="/fonts/ahem.css">
6+
7+
<style>
8+
.container {
9+
font: 20px/1 Ahem;
10+
border: 5px solid gold;
11+
inline-size: 8em;
12+
display: inline-block;
13+
}
14+
.container.rtl {
15+
direction: rtl;
16+
}
17+
.rel {
18+
position: relative;
19+
}
20+
.cb-rect {
21+
color: green;
22+
}
23+
</style>
24+
25+
<div class="container">
26+
XX
27+
<span class="rel">
28+
<span class="cb-rect">XX</span>XX<br>
29+
XXX<span class="cb-rect">XX</span>XXX<br>
30+
XXX<span class="cb-rect">XX</span>
31+
</span>
32+
</div>
33+
34+
<div class="container rtl">
35+
XX<span class="rel"><span class="cb-rect">XXXXX</span><br>
36+
XXX<span class="cb-rect">XXXXX</span><br>
37+
<span class="cb-rect">XXXXX</span>
38+
</span>
39+
</div>

‎css/css-position/position-absolute-in-inline-005.html‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
<!DOCTYPE html>
2+
<title>CSS Positioned Test: Test the inline containing block rectangle for a fragmented inline element</title>
3+
<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
4+
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
5+
<link rel="help" href="https://drafts.csswg.org/css-position-3/#absolute-cb">
6+
<link rel="match" href="position-absolute-in-inline-005-ref.html">
7+
<link rel="stylesheet" href="/fonts/ahem.css">
8+
9+
<style>
10+
.container {
11+
font: 20px/1 Ahem;
12+
border: 5px solid gold;
13+
inline-size: 8em;
14+
display: inline-block;
15+
}
16+
.container.rtl {
17+
direction: rtl;
18+
}
19+
.rel {
20+
position: relative;
21+
}
22+
.cb-rect {
23+
position: absolute;
24+
inset: 0;
25+
background: green;
26+
}
27+
</style>
28+
29+
<div class="container">
30+
XX
31+
<span class="rel">
32+
XXXX<br>
33+
XXXXXXXX<br>
34+
XXXXX
35+
<div class="cb-rect"></div>
36+
</span>
37+
</div>
38+
39+
<div class="container rtl">
40+
XX
41+
<span class="rel">
42+
XXXX<br>
43+
XXXXXXXX<br>
44+
XXXXX
45+
<div class="cb-rect"></div>
46+
</span>
47+
</div>

‎css/css-position/position-absolute-in-inline-006-ref.html‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<!DOCTYPE html>
2+
<title>CSS Positioned Reference: Test the inline containing block rectangle for a fragmented inline element in vertical writing mode</title>
3+
<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
4+
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
5+
<link rel="stylesheet" href="/fonts/ahem.css">
6+
7+
<style>
8+
.container {
9+
font: 20px/1 Ahem;
10+
border: 5px solid gold;
11+
inline-size: 8em;
12+
display: inline-block;
13+
writing-mode: vertical-rl;
14+
}
15+
.container.rtl {
16+
direction: rtl;
17+
}
18+
.rel {
19+
position: relative;
20+
}
21+
.cb-rect {
22+
color: green;
23+
}
24+
</style>
25+
26+
<div class="container">
27+
XX
28+
<span class="rel">
29+
<span class="cb-rect">XX</span>XX<br>
30+
XXX<span class="cb-rect">XX</span>XXX<br>
31+
XXX<span class="cb-rect">XX</span>
32+
</span>
33+
</div>
34+
35+
<div class="container rtl">
36+
XX<span class="rel"><span class="cb-rect">XXXXX</span><br>
37+
XXX<span class="cb-rect">XXXXX</span><br>
38+
<span class="cb-rect">XXXXX</span>
39+
</span>
40+
</div>

‎css/css-position/position-absolute-in-inline-006.html‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
<!DOCTYPE html>
2+
<title>CSS Positioned Test: Test the inline containing block rectangle for a fragmented inline element in vertical writing mode</title>
3+
<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
4+
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
5+
<link rel="help" href="https://drafts.csswg.org/css-position-3/#absolute-cb">
6+
<link rel="match" href="position-absolute-in-inline-006-ref.html">
7+
<link rel="stylesheet" href="/fonts/ahem.css">
8+
9+
<style>
10+
.container {
11+
font: 20px/1 Ahem;
12+
border: 5px solid gold;
13+
inline-size: 8em;
14+
display: inline-block;
15+
writing-mode: vertical-rl;
16+
}
17+
.container.rtl {
18+
direction: rtl;
19+
}
20+
.rel {
21+
position: relative;
22+
}
23+
.cb-rect {
24+
position: absolute;
25+
inset: 0;
26+
background: green;
27+
}
28+
</style>
29+
30+
<div class="container">
31+
XX
32+
<span class="rel">
33+
XXXX<br>
34+
XXXXXXXX<br>
35+
XXXXX
36+
<div class="cb-rect"></div>
37+
</span>
38+
</div>
39+
40+
<div class="container rtl">
41+
XX
42+
<span class="rel">
43+
XXXX<br>
44+
XXXXXXXX<br>
45+
XXXXX
46+
<div class="cb-rect"></div>
47+
</span>
48+
</div>

0 commit comments

Comments
 (0)