text-emphasis-position-below-right-002

text-emphasis-position - below right - basic cases

WeasyPrint

Reference (good) by WeasyPrint

Reference (good) by this browser

This browser

Flags
ahem
Assertion
This property describes where emphasis marks are drawn at.

Source

 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 - below 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-below-right-002-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: below right;
15 			}
16 			.test-vertical
17 			{
18 				writing-mode: vertical-rl;
19 			}
20 			/* the CSS below is not part of the test */
21 			.common
22 			{
23 				left: -0.5em;
24 				line-height: 1em;
25 				position: relative;
26 			}
27 			.displayarea
28 			{
29 				border: solid 1px gray;
30 				padding: 10px;
31 				width: 10em;
32 			}
33 			.floatright
34 			{
35 				float: right;
36 			}
37 			.parent
38 			{
39 				background: yellow;
40 				border: solid 1px gray;
41 				color: blue;
42 				font: 20px/1em ahem;
43 				height: 6em;
44 				width: 2em;
45 			}
46 			.refcommon
47 			{
48 				font-size: 0.5em;
49 				left: 4.1em;
50 				position: absolute;
51 				top: 0.1em;
52 			}
53 		</style>
54 	</head>
55 	<body>
56 		<div>
57 			<p>Test passes if a pair of left and right block in the square box is identical.</p>
58 			<p>vertical</p>
59 			<div class="displayarea">
60 				<div class="parent floatright">
61 					<span class="common">&nbsp;a<span class="refcommon"></span></span><br>
62 					<span class="common">&nbsp;b<span class="refcommon"></span></span><br>
63 					<span class="common">&nbsp;c<span class="refcommon"></span></span><br>
64 					&nbsp;&nbsp;<br>
65 					<span class="common">&nbsp;d</span><br>
66 					<span class="common">&nbsp;e</span><br>
67 				</div>
68 				<div class="parent test-vertical">
69 					<span class="test">abc</span> de
70 				</div>
71 			</div>
72 		</div>
73 	</body>
74 </html>