third_party/WebKit/LayoutTests/imported/csswg-test/css-pseudo-4/first-letter-003.html

   1 <!doctype html>
   2 <html>
   3 <head>
   4         <meta charset="utf-8">
   5         <title>CSS Test: ::first-letter formatting</title>
   6         <link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
   7         <link rel="match" href="first-letter-001-ref.html">
   8         <link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#first-letter-styling">
   9         <meta name="flags" content="">
  10         <meta name="assert" content="Test checks that a floated ::first-letter is formatted identically to a floated non-pseudo element with the same content.">
  11         <style>
  12         div {
  13                 font-size: 50px;
  14                 position: absolute;
  15                 left: 30px;
  16                 top: 50px;
  17         }
  18         #d1::first-letter {
  19                 color: red;
  20                 background: red;
  21                 float: left;
  22         }
  23         #d2 span {
  24                 color: green;
  25                 background: green;
  26                 float: left;
  27         }
  28         </style>
  29 </head>
  30 <body>
  31         <p>Test passes if there is a <strong>filled green rectangle</strong> and <strong>no red</strong>.</p>
  32         <div id="d1">a</div>
  33         <div id="d2"><span>a</span></div>
  34 </body>
  35 </html>