1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
|
<!DOCTYPE html>
<meta charset="utf-8">
<title>Symbol markers with unicode-bidi</title>
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-lists/#markers" title="3. Markers">
<link rel="match" href="list-marker-symbol-bidi-ref.html">
<meta name="assert" content="This test checks that symbol markers are painted independently of unicode-bidi.">
<style>
section {
float: left;
}
.inside {
list-style-position: inside;
}
.embed-item, .embed-both {
unicode-bidi: embed;
}
.isolate-item, .isolate-both {
unicode-bidi: isolate;
}
.override-item, .override-both {
unicode-bidi: bidi-override;
}
.isolateoverride-item, .isolateoverride-both {
unicode-bidi: isolate-override;
}
.plaintext-item, .plaintext-both {
unicode-bidi: plaintext;
}
.embed-item::marker, .embed-none::marker,
.isolate-item::marker, .isolate-none::marker,
.override-item::marker, .override-none::marker,
.paintext-item::marker, .paintext-none::marker,
.isolateoverride-item::marker, .isolateoverride-none::marker {
unicode-bidi: normal;
}
::marker { font-family: inherit; }
</style>
<section>
<ul dir="ltr">
<li class="outside embed-none">text</li>
<li class="outside embed-item">text</li>
<li class="outside embed-marker">text</li>
<li class="outside embed-both">text</li>
<li class="inside embed-none">text</li>
<li class="inside embed-item">text</li>
<li class="inside embed-marker">text</li>
<li class="inside embed-both">text</li>
</ul>
<ul dir="rtl">
<li class="outside isolate-none">text</li>
<li class="outside isolate-item">text</li>
<li class="outside isolate-marker">text</li>
<li class="outside isolate-both">text</li>
<li class="inside isolate-none">text</li>
<li class="inside isolate-item">text</li>
<li class="inside isolate-marker">text</li>
<li class="inside isolate-both">text</li>
</ul>
</section>
<section>
<ul dir="ltr">
<li class="outside isolate-none">text</li>
<li class="outside isolate-item">text</li>
<li class="outside isolate-marker">text</li>
<li class="outside isolate-both">text</li>
<li class="inside isolate-none">text</li>
<li class="inside isolate-item">text</li>
<li class="inside isolate-marker">text</li>
<li class="inside isolate-both">text</li>
</ul>
<ul dir="rtl">
<li class="outside isolate-none">text</li>
<li class="outside isolate-item">text</li>
<li class="outside isolate-marker">text</li>
<li class="outside isolate-both">text</li>
<li class="inside isolate-none">text</li>
<li class="inside isolate-item">text</li>
<li class="inside isolate-marker">text</li>
<li class="inside isolate-both">text</li>
</ul>
</section>
<section>
<ul dir="ltr">
<li class="outside override-none">text</li>
<li class="outside override-item">text</li>
<li class="outside override-marker">text</li>
<li class="outside override-both">text</li>
<li class="inside override-none">text</li>
<li class="inside override-item">text</li>
<li class="inside override-marker">text</li>
<li class="inside override-both">text</li>
</ul>
<ul dir="rtl">
<li class="outside override-none">text</li>
<li class="outside override-item">text</li>
<li class="outside override-marker">text</li>
<li class="outside override-both">text</li>
<li class="inside override-none">text</li>
<li class="inside override-item">text</li>
<li class="inside override-marker">text</li>
<li class="inside override-both">text</li>
</ul>
</section>
<section>
<ul dir="ltr">
<li class="outside isolateoverride-none">text</li>
<li class="outside isolateoverride-item">text</li>
<li class="outside isolateoverride-marker">text</li>
<li class="outside isolateoverride-both">text</li>
<li class="inside isolateoverride-none">text</li>
<li class="inside isolateoverride-item">text</li>
<li class="inside isolateoverride-marker">text</li>
<li class="inside isolateoverride-both">text</li>
</ul>
<ul dir="rtl">
<li class="outside isolateoverride-none">text</li>
<li class="outside isolateoverride-item">text</li>
<li class="outside isolateoverride-marker">text</li>
<li class="outside isolateoverride-both">text</li>
<li class="inside isolateoverride-none">text</li>
<li class="inside isolateoverride-item">text</li>
<li class="inside isolateoverride-marker">text</li>
<li class="inside isolateoverride-both">text</li>
</ul>
</section>
<section>
<ul dir="ltr">
<li class="outside plaintext-none">text</li>
<li class="outside plaintext-item">text</li>
<li class="outside plaintext-marker">text</li>
<li class="outside plaintext-both">text</li>
<li class="inside plaintext-none">text</li>
<li class="inside plaintext-item">text</li>
<li class="inside plaintext-marker">text</li>
<li class="inside plaintext-both">text</li>
</ul>
<ul dir="rtl">
<li class="outside plaintext-none">text</li>
<li class="outside plaintext-item">text</li>
<li class="outside plaintext-marker">text</li>
<li class="outside plaintext-both">text</li>
<li class="inside plaintext-none">text</li>
<li class="inside plaintext-item">text</li>
<li class="inside plaintext-marker">text</li>
<li class="inside plaintext-both">text</li>
</ul>
</section>
|
