summaryrefslogtreecommitdiffstats
path: root/layout/reftests/first-letter/font-text-styles.html
blob: e117a6bbf6030369cfcf0d5b920af4175ead9b50 (plain)
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
<!DOCTYPE HTML>
<html>
<head>
<title>Testing first-letter handling of font/text styles</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style type="text/css">
html { overflow: hidden; }
body {
  margin: 1em;
  font-size: 25px;
  line-height: 1.2em;
  font-family: serif;
}

div { width: 200px; }
p { width: 0.5em; margin: 0; }
p:first-letter { font-weight: bold; text-transform: uppercase; }
p.reverse:first-letter { font-style: italic; text-transform: lowercase; }
span.floater { float: left; }
span.floater:first-letter { font-family: sans-serif; text-transform: uppercase; }
span.special { display: inline-block; }
span.special:first-letter { font-weight: bold; text-transform: uppercase; }
</style>

</head>
<body>
<div>
<p>yellow corndog</p>
<p class="reverse">HIPPIE BANANA</p>
<p><span class="floater">gonzo macadamia</span></p>
<p class="reverse">FELICITOUS <span class="special">raspberry</span></p>
</div>
</body>
</html>