Upstream version 7.36.149.0
[platform/framework/web/crosswalk.git] / src / third_party / WebKit / LayoutTests / fast / text / text-letter-spacing.html
index 5bdefd6..a199fae 100644 (file)
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"\r
- "http://www.w3.org/TR/html4/loose.dtd">\r
-<html>\r
-<head>\r
-<title>letter-spacing.html</title>\r
-<style type="text/css">\r
-p { \r
-    text-indent: 10em;\r
-    background-color: #eee;\r
-}\r
-p.desc {\r
-    text-indent: 0em;\r
-    background-color: white;\r
-}\r
-.opaque {\r
-    opacity: 0.5;\r
-    background-color: #ccf;\r
-}\r
-\r
-.ls0 {\r
-    letter-spacing: 0em;\r
-}\r
-.ls05 {\r
-    letter-spacing: 0.5em;\r
-}\r
-.ls200 {\r
-    letter-spacing: 200em;\r
-}\r
-.ls10000 {\r
-    letter-spacing: 100000em;\r
-}\r
-\r
-.ls-05 { \r
-    letter-spacing: -0.5em;\r
-}\r
-.ls-200 {\r
-    letter-spacing: -200em;\r
-}\r
-.ls-10000 { \r
-    letter-spacing: -10000em;\r
-}\r
-\r
-.rtl {\r
-    direction: rtl;\r
-    unicode-bidi: bidi-override;\r
-}\r
-     \r
-</style>\r
-</head>\r
-<body>\r
-<!-- these should render fine (tests regular, partially opaque text) -->\r
-<p class="desc">The following lines test various combinations of\r
-letter-spacing (especially negative values) and opacity. All of the lines\r
-should say "Hello, world" but the spacing and background shading will vary\r
-from test to test. The W3C specs are fairly silent on how user agents\r
-should handle unusual values of letter-spacing, especially negative ones,\r
-which are explicitly implementation-dependent. Different browsers will\r
-render these differently, but hopefully the WebKit ports will be consistent,\r
-at least.</p>\r
-\r
-<p class="desc">The first line should be normally spaced.</p>\r
-<p><span class="ls0">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a slight positive letter spacing, and\r
-should be slightly spaced out (wider than normal).</p>\r
-<p><span class="ls05">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a large positive letter spacing, and\r
-should be *very* spaced out. You may only see an 'H' and a 'w', perhaps \r
-on two different lines, unless you scroll way to the right.</p>\r
-<p><span class="ls200">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a very large positive letter spacing,\r
-and should also be *very* spaced out. You may only see an 'H' and a 'w', \r
-perhaps on two different lines, unless you scroll way to the right.</p>\r
-<p><span class="ls10000">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a small negative line spacing, and\r
-should be crammed backwards</p>\r
-<p><span class="ls-05">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a large negative line spacing, and\r
-should be just display an 'H'</p>\r
-<p><span class="ls-200">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a very large negative line spacing,\r
-and should just have an 'H'.</p>\r
-<p><span class="ls-10000">Hello, world</span></p>\r
-\r
-<p class="desc">The next few lines test the interaction with opacity.\r
-The first line should be normally spaced out, slightly opaque, \r
-and on a differently-colored background</p>\r
-<p><span class="ls0 opaque">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a small positive line spacing, and \r
-should be slightly spaced out, opaque, and on a background.</p>\r
-<p><span class="ls05 opaque">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a large positive line spacing, and\r
-should be very widely spaced, on a background.</p>\r
-<p><span class="ls200 opaque">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a very large positive line spacing, \r
-and should be very widely spaced but blank, and on a background.</p>\r
-<p><span class="ls10000 opaque">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a small negative line spacing, and should\r
-be blank.</p>\r
-<p><span class="ls-05 opaque">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a large negative line spacing, and\r
-should be blank.</p>\r
-<p><span class="ls-200 opaque">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a very large negative line spacing,\r
-and should be blank.</p>\r
-<p><span class="ls-10000 opaque">Hello, world</span></p>\r
-\r
-<p class="desc">Now we do a few basic right-to-left tests:</p>\r
-\r
-<p class="desc">The first line should be normally spaced.</p>\r
-<p><span class="ls0 rtl">Hello, world</span></p>\r
-\r
-<p class="desc">The next line should be slightly spaced out (wider than\r
-normal).</p>\r
-<p><span class="ls05 rtl">Hello, world</span></p>\r
-<p class="desc">The next line should be crammed backwards, just as if \r
-it wasn't right-to-left</p>\r
-<p><span class="ls-05 rtl">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a large negative line spacing, and \r
-should just print a 'd'</p>\r
-<p><span class="ls-200 rtl">Hello, world</span></p>\r
-\r
-<p class="desc">Now, opacity as well - \r
-The next line should be printed right to left, slightly spaced out \r
-(wider than normal), and on a background.</p>\r
-<p><span class="ls05 rtl opaque">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a small negative line spacing, and\r
-should be blank.</p>\r
-<p><span class="ls-05 rtl opaque">Hello, world</span></p>\r
-\r
-<p class="desc">The next line tests a large negative line spacing, and\r
-it should be blank.</p>\r
-<p><span class="ls-200 rtl opaque">Hello, world</span></p>\r
-\r
-</body>\r
-</html>\r
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+ "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+<head>
+<title>letter-spacing.html</title>
+<style type="text/css">
+body { overflow: hidden; }
+p { 
+    text-indent: 10em;
+    background-color: #eee;
+}
+p.desc {
+    text-indent: 0em;
+    background-color: white;
+}
+.opaque {
+    opacity: 0.5;
+    background-color: #ccf;
+}
+
+.ls0 {
+    letter-spacing: 0em;
+}
+.ls05 {
+    letter-spacing: 0.5em;
+}
+.ls200 {
+    letter-spacing: 200em;
+}
+.ls10000 {
+    letter-spacing: 100000em;
+}
+
+.ls-05 { 
+    letter-spacing: -0.5em;
+}
+.ls-200 {
+    letter-spacing: -200em;
+}
+.ls-10000 { 
+    letter-spacing: -10000em;
+}
+
+.rtl {
+    direction: rtl;
+    unicode-bidi: bidi-override;
+}
+     
+</style>
+</head>
+<body>
+<!-- these should render fine (tests regular, partially opaque text) -->
+<p class="desc">The following lines test various combinations of
+letter-spacing (especially negative values) and opacity. All of the lines
+should say "Hello, world" but the spacing and background shading will vary
+from test to test. The W3C specs are fairly silent on how user agents
+should handle unusual values of letter-spacing, especially negative ones,
+which are explicitly implementation-dependent. Different browsers will
+render these differently, but hopefully the WebKit ports will be consistent,
+at least.</p>
+
+<p class="desc">The first line should be normally spaced.</p>
+<p><span class="ls0">Hello, world</span></p>
+
+<p class="desc">The next line tests a slight positive letter spacing, and
+should be slightly spaced out (wider than normal).</p>
+<p><span class="ls05">Hello, world</span></p>
+
+<p class="desc">The next line tests a large positive letter spacing, and
+should be *very* spaced out. You may only see an 'H' and a 'w', perhaps 
+on two different lines, unless you scroll way to the right.</p>
+<p><span class="ls200">Hello, world</span></p>
+
+<p class="desc">The next line tests a very large positive letter spacing,
+and should also be *very* spaced out. You may only see an 'H' and a 'w', 
+perhaps on two different lines, unless you scroll way to the right.</p>
+<p><span class="ls10000">Hello, world</span></p>
+
+<p class="desc">The next line tests a small negative line spacing, and
+should be crammed backwards</p>
+<p><span class="ls-05">Hello, world</span></p>
+
+<p class="desc">The next line tests a large negative line spacing, and
+should be just display an 'H'</p>
+<p><span class="ls-200">Hello, world</span></p>
+
+<p class="desc">The next line tests a very large negative line spacing,
+and should just have an 'H'.</p>
+<p><span class="ls-10000">Hello, world</span></p>
+
+<p class="desc">The next few lines test the interaction with opacity.
+The first line should be normally spaced out, slightly opaque, 
+and on a differently-colored background</p>
+<p><span class="ls0 opaque">Hello, world</span></p>
+
+<p class="desc">The next line tests a small positive line spacing, and 
+should be slightly spaced out, opaque, and on a background.</p>
+<p><span class="ls05 opaque">Hello, world</span></p>
+
+<p class="desc">The next line tests a large positive line spacing, and
+should be very widely spaced, on a background.</p>
+<p><span class="ls200 opaque">Hello, world</span></p>
+
+<p class="desc">The next line tests a very large positive line spacing, 
+and should be very widely spaced but blank, and on a background.</p>
+<p><span class="ls10000 opaque">Hello, world</span></p>
+
+<p class="desc">The next line tests a small negative line spacing, and should
+be blank.</p>
+<p><span class="ls-05 opaque">Hello, world</span></p>
+
+<p class="desc">The next line tests a large negative line spacing, and
+should be blank.</p>
+<p><span class="ls-200 opaque">Hello, world</span></p>
+
+<p class="desc">The next line tests a very large negative line spacing,
+and should be blank.</p>
+<p><span class="ls-10000 opaque">Hello, world</span></p>
+
+<p class="desc">Now we do a few basic right-to-left tests:</p>
+
+<p class="desc">The first line should be normally spaced.</p>
+<p><span class="ls0 rtl">Hello, world</span></p>
+
+<p class="desc">The next line should be slightly spaced out (wider than
+normal).</p>
+<p><span class="ls05 rtl">Hello, world</span></p>
+<p class="desc">The next line should be crammed backwards, just as if 
+it wasn't right-to-left</p>
+<p><span class="ls-05 rtl">Hello, world</span></p>
+
+<p class="desc">The next line tests a large negative line spacing, and 
+should just print a 'd'</p>
+<p><span class="ls-200 rtl">Hello, world</span></p>
+
+<p class="desc">Now, opacity as well - 
+The next line should be printed right to left, slightly spaced out 
+(wider than normal), and on a background.</p>
+<p><span class="ls05 rtl opaque">Hello, world</span></p>
+
+<p class="desc">The next line tests a small negative line spacing, and
+should be blank.</p>
+<p><span class="ls-05 rtl opaque">Hello, world</span></p>
+
+<p class="desc">The next line tests a large negative line spacing, and
+it should be blank.</p>
+<p><span class="ls-200 rtl opaque">Hello, world</span></p>
+
+</body>
+</html>