1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2 <html>
3 <head>
4 <title>CSS Test: text-emphasis-position - above right - basic cases</title>
5 <link rel="author" title="Makoto Kikuchi" href="mailto:kikuchi@est.co.jp">
6 <link rel="help" title="CSS Text Level 3: 11.2.4. Emphasis Mark Position: the ‘text-emphasis-position’ property" href="http://www.w3.org/TR/css-text-3/#text-emphasis-position">
7 <link rel="match" href="reference/text-emphasis-position-above-right-001-ref.htm">
8 <meta name="flags" content="ahem">
9 <meta name="assert" content="This property describes where emphasis marks are drawn at.">
10 <style type="text/css">
11 .test
12 {
13 text-emphasis-style: filled circle;
14 text-emphasis-position: above right;
15 }
16 /* the CSS below is not part of the test */
17 .common
18 {
19 line-height: 1em;
20 position: relative;
21 }
22 .margin
23 {
24 margin-top: 0.5em;
25 }
26 .parent
27 {
28 background: yellow;
29 border: solid 1px gray;
30 color: blue;
31 font: 20px/1em ahem;
32 width: 6em;
33 }
34 .refcommon
35 {
36 font-size: 0.5em;
37 left: 0.6em;
38 position: absolute;
39 }
40 .top
41 {
42 top: -1.4em;
43 }
44 </style>
45 </head>
46 <body>
47 <div>
48 <p>Test passes if a pair of upper and lower block in the square box is identical.</p>
49 <p>horizontal</p>
50 <div class="parent">
51 <div><span class="test">abc</span> de<br><br></div>
52 </div>
53 <br>
54 <div class="parent">
55 <div class="margin">
56 <div class="margin">
57 <span class="common">a<span class="refcommon top">●</span></span><span class="common">b<span class="refcommon top">●</span></span><span class="common">c<span class="refcommon top">●</span></span>
58 de<br>
59 <br>
60 </div>
61 </div>
62 </div>
63 </div>
64 </body>
65 </html>